html
9 TopicsCreating Image Maps or something similar
Anyone familiar with Image Map? I'm having this project of trying to create an image map of a real map location and then each zip code would have different link/page in that same image. I'm just curious if it's possible to do it here in SharePoint as I've seen people doing it but in HTML.2.3KViews0likes1CommentHTML code embed into SharePoint Online page
A colleague of mine is using a HTML code on the current SharePoint on-prem 2013 environment to place svg graphics onto another SVG image. Is it still possible to embed an HTML code into a SharePoint Online page? <!DOCTYPE html> <html> <body> <!-- insert width/height in line below to define picture size, makes sense to align with size of background image --> <svg id="screenshot1" width="500" height="400" xmlns="http://www.w3.org/2000/svg"> <!-- define path to background image below --> <image href="base-image.svg"/> <!--predefined marker symbols --> <symbol id="arrow-red-solid"><image href="./arrow_red_solid.svg"/></symbol> <symbol id="arrow-red-outline"><image href="./arrow_red_outline.svg"/></symbol> <symbol id="arrow-orange-solid"><image href="./arrow_orange_solid.svg"/></symbol> <symbol id="arrow-orange-outline"><image href="./arrow_orange_outline.svg"/></symbol> <symbol id="arrow-blue-solid"><image href="./arrow_blue_solid.svg"/></symbol> <symbol id="arrow-blue-outline"><image href="./arrow_blue_outline.svg"/></symbol> <!-- use picture markers, shapes, text as needed, follow SVG syntax https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial --> <!-- shape positions are expressed in pixel where the origin is the top left corner of the image, x=left-right, y=top-bottom --> <line x1="10" x2="50" y1="110" y2="150" stroke="black" stroke-width="5"/> <rect x="360" y="230" width="100" height="20" style="fill:none;stroke:blue;stroke-width:2" /> <rect x="320" y="300" rx="5" ry="5" width="100" height="20" style="fill:none;stroke:orange;stroke-width:2"/> <circle cx="50" cy="50" r="10" style="fill:none;stroke:red;stroke-width:2"/> <ellipse cx="150" cy="50" rx="30" ry="10" style="fill:none;stroke:red;stroke-width:2"/> <use x="80" y="180" href="#arrow-red-solid" /> <use x="60" y="250" href="#arrow-red-outline" /> <use x="100" y="200" href="#arrow-blue-outline" /> <use x="120" y="220" href="#arrow-orange-outline" /> <text x="380" y="220" font-size="24" fill="blue">Text1</text> </svg> </body> </html> Right now I'm not able to do that with the "embed" webpart. ThanksSolved13KViews0likes6CommentsLoad predefined data from columns and update field with possible selection with Javascript
I am struggling with piece of code. I am working on SharePoint 2013 and I am trying to set 2 fields fixed when creating a new item in list. All 3 fields are lookup columns, but the red highlighted fields I want to set as fixed and the yellow highlighted field is conditioned by the field Vyberova_Skupina_Sluzba Also Vyberova_Skupina_Sluzba is conditioned by the field Vyber_Oblast I used the part of the code below, the fields are fixed Vyber_Oblast and Vyberova_Skupina_Sluzba but third column is not updated. function nastavSluzba(){ $('#Produktova_Skupina_Sluzba').find('select').val('Hypotekárne úvery'); $('#Vyber_Oblasti').find('select').val('Úverové produkty pre FO') $('#tableNapoveda').remove(); $("#Vyber_Oblasti").find('select').attr("disabled", true); $("#Produktova_Skupina_Sluzba").find('select').attr("disabled", true); $("#Vyber_Oblasti").find('select').css({"background-color": "white","color": "black"}); $("#Produktova_Skupina_Sluzba").find('select').css({"background-color": "white","color": "black"}); var allOptions = document.querySelectorAll("[title=Vyber_Oblasti] option"); [].some.call(allOptions, function(option) { if (option.innerHTML == "Úverové produkty pre FO") { option.selected = "Úverové produkty pre FO"; return true; } }); var allOption = document.querySelectorAll("[title=Produktova_Skupina_Sluzba] option"); [].some.call(allOption, function(option) { if (option.innerHTML == "Hypotekárne úvery") { option.selected = "Hypotekárne úvery"; return true; } }); Can you help me make sure that the third field is loaded automatically and that the user can select an option that falls under Produktova_Skupina_Sluzba ?670Views0likes0CommentsEmbed interactive Bokeh HTML Plot
Hei I try to embed a https://docs.bokeh.org/en/latest/index.html# plot in a sharepoint site. I've saved the plot as HTML file locally. I think embedding HTML was somehow possible in previous sharepoint versions. Does anybody know how to do it in sharepoint online nowadays? Thanks for the help. Best regards1.2KViews0likes0CommentsREST API removes HTML markup from plain text MLoT
There is an MLoT field, set as Plain Text (not enhanced not RTF), that is retrieved using REST api ajax call. The data actually contains "< a href="https://... etc">This website< / a >", but when the REST data is returned, the HTML markup tags are removed. So, in the example above only "This website" gets returned. Is it possible to return ALL of the text from the field, without getting the < a > < / a > stripped of it? https://www.easy-bins.com1KViews0likes0CommentsHow to stop CSS to be applied to a part of layout on the samepage, (wikipage)
I have created a SharePoint Page using Wiki page option. - I used the two column option and created the page. Added the html code for accordions using the Js and some css style I did that by using Insert-> Embedded code -> added the code in the box and it was added as a webpart and it solved my purpose. - But here is a new problem, I don't want the CSS to be applied to the other column of the page. How to avoid that. Also, I want to change the color of the alternate header to grey, any code for that would really help, thank you. please help Best Regards <script src="..//SiteAssets/jquery-2.0.2.min.js"></script> <!DOCTYPE html><html lang="en"><head><meta charset="utf-8"> <title>Untitled</title> <style> /*** CSS for collapsable headers ***/ /*** Expanded h2 ***/ #DeltaPlaceHolderMain h2:before { display: inline-block; margin-right: .5em; border-radius: 2em; padding: 0 .05em .05em ; background: black; color: #fff; cursor: pointer; vertical-align:middle; font: bold 0.8em/0.8 verdana, sans-serif; content: '\2212'; /* math operators minus sign */ } /*** Collapsed h2 ***/ #DeltaPlaceHolderMain h2.expand:before { content: '\2b'; /* basic latin plus sign */ } </style> </head><body> <div id="DeltaPlaceHolderMain"> </div> Vishnu729Views0likes0CommentsCreate webpart that uses MathJax library
I am attempting to create a webpart that will allow me to inject html into a modern page. I have that portion working. I now want to be able to use the MathJax library to insert mathematical formulas into a page. I think I have referenced the library correctly but because the user is allowed to edit the html on the fly, MathJax never does anything with the LaTeX code within the html. I will paste my code here. I am hoping that someone will have an idea of how to get this to work. import { Version } from '@microsoft/sp-core-library'; import { BaseClientSideWebPart, IPropertyPaneConfiguration, PropertyPaneTextField } from '@microsoft/sp-webpart-base'; import { escape } from '@microsoft/sp-lodash-subset'; import styles from './HtmlWebPart.module.scss'; import * as strings from 'HtmlWebPartStrings'; import { PropertyFieldCodeEditor, PropertyFieldCodeEditorLanguages } from '@pnp/spfx-property-controls/lib/PropertyFieldCodeEditor'; import * as mathjax from 'mathjax'; export interface IHtmlWebPartProps { description: string; htmlCode: string; } export default class HtmlWebPart extends BaseClientSideWebPart { public render(): void { this.domElement.innerHTML = ` ${ this.properties.htmlCode } `; } protected get dataVersion(): Version { return Version.parse('1.0'); } protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration { return { pages: [ { header: { description: "This web part allows you to enter HTML code directly into a page." }, groups: [ { groupName: strings.BasicGroupName, groupFields: [ PropertyFieldCodeEditor('htmlCode', { label: 'Edit HTML Code', panelTitle: 'Edit HTML Code', initialValue: this.properties.htmlCode, onPropertyChange: this.onPropertyPaneFieldChanged, properties: this.properties, disabled: false, key: 'codeEditorFieldId', language: PropertyFieldCodeEditorLanguages.HTML }) ] } ] } ] }; } }2KViews0likes0CommentsSharePoint Online view html , don't download
Hi All My use case is as follows: As the database admin I need to regularly (every week) upload a package of HTML / CSS files which are interlinked and make them visible to many staff so that they can see the structure of our Data Warehouse. An automated tool creates the HTML / CSS and it contains hundreds of files. The problem: When put into a SharePoint Online library if a user clicks on a link to one of the HTML files it downloads rather than displaying the HTML content. We are using SharePoint Online. We have tried : using classic pages and pointing content editor webparts to the index of this package of html files. The index html displays but the next click downloads the next html file. powershell scripting the change html files to ASPX and powershell plus RegEx to fix all the links within files Does anyone have a simple way to tell SharePoint Online that we actually want it to display html file within one library ? Happy to hear how you achieve this via hacks or paid solutions. Many thanks everyone7KViews0likes2CommentsUnable to directly Edit html in the browser in SharePoint Online
From yesterday onwards, am Unable to directly Edit html in the browser in SharePoint Online env. i have created a folder called htmfiles in my siteassets librray on my SPO site, and i have a html file that has css, js, and html content. When i tried to edit the html file, am getting a message, " its just a preview". Did MSFF make any changes in this behavior for the last few days?967Views1like0Comments