Recently, I started a newsletter. During the planning phase, I thought about content for my humbled subscribers. I watched a couple of development sessions while attending the Microsoft 365 Community Day. While great developers delivered those sessions, I recognised the overuse of <div> elements.
[Read more]
This article is one of the follow-up articles on how to use the HTML Dialog element in SharePoint Framework. Now we look closer at the possibilities of positioning the modal dialogue.
You will learn to put the dialogue on the page’s top, bottom, left, and right.
When your application or webpart requires a modal dialogue, you might use the package @microsoft/sp-dialog based on this tutorial on how to use it. There is nothing wrong with this solution but something out of time.
[Read more]
Recently two changes have been shipped with the latest browsers versions that impact your development today too. In short, you can now better define the loading behaviour for images. It’s big news in case of performance and usability. Those changes are:
You are familiar with the JavaScript method like ‘document.getElementByID’. Since HTML5 the Document Object Model has more to offer than return an element by its ID on a document.
Use this.document instead of document
I case of web part development you should forget that the document object inside and HTML exists instead you should request HTML elements differently.
Consider the following simple scenario. You like to write a new SPFx web part, and you have the requirement to show a popup or a flyout container opened from a web part. This flyout menu should overlay whatever comes after your web part.
Recently a new feature has been added to the authoring process in SharePoint online. This new feature helps you to define appropriate alternative text descriptions for your images on pages. In general to specify alternative text for images is possible the first time in SharePoint history. Previously only the title of an image could be defined.
When a new image gets inserted on a page, the image gets analysed by a background service, which assumes the content of the image and returns an appropriate description. Through the help of pattern recognition and artificial intelligence, the returned values are pretty accurate, at least with the pictures I tested this feature so far.
When you create a new project without any framework, the default web part content in the code will be added through innerHTML.
Technically there is nothing wrong with this approach, but you might run into a problem when you add more content to the web part afterward using the same method. In this case, the previously added content will be overwritten.
To avoid this behavior, you can use jQuery and the ‘append‘ or ‘prepend‘ methods to add your content. It works well but requires an external library.
Instead of using jQuery, there is a native method in the document object model of HTML available.
Have you ever tried to add a caption to an image inside the SharePoint rich text editor? In this case you might end up editing the source code of the editor. Before you touch the source code of your page, let me show you a more convenient way to achieve this without advanced coding techniques.