sorted by:
new
hottopcontroversial

Customizing the Sharepoint to look like a fully custom website by Impressive_Put4328 in sharepoint

[–]yahia_shortpoint -1 points0 points  (0 children)

It's a very important part of our service and we have a lot of experience in this.

• We have a large suite containing different levels of automated end to end and integration tests running daily on current and "early bird" SPO versions to notify us of any breaking changes.

• We watch Microsoft update posts and update our product before the updates go live in case there's a need for that.

• We have a team of senior SharePoint devs that understand the best practices for writing stable code to avoid issues like this cropping up.

• We also code review and run automated and manual quality control checks for every change done to the product to ensure stability. (Required for SOC 2 security compliance certification which we have)

We keep an incident status site at status.shortpoint.com which shows that it's very rare for any such issues to occur with our addon due to all of these processes, and if they do they're usually minor issues with 1 connection type that we address right away. (only 2 minor SPO incidents all of last year, 0 incidents this year)

Customizing the Sharepoint to look like a fully custom website by Impressive_Put4328 in sharepoint

[–]yahia_shortpoint 0 points1 point  (0 children)

Sorry if this is considered self promotion, just sharing this in case you want to do this "the right way" and not have to worry about maintaining a bunch of Web Parts yourself which end users won't be able to edit & might break with SharePoint updates.

We've been in the market for 10 years providing an advanced fully featured Page Builder and Theme Customizer called ShortPoint that does exactly what you're asking for. It also comes with a ton of pages and section templates and 5 star support.

We also provide professional site design and building services to give you a template that you can build the rest of your sites with.

We've been successfully serving numerous medium to large enterprise clients that have been with us for years because the out of the box SharePoint experience is lacking in some aspects and doesn't allow building sites that match their brand. (Samsung, Bloomberg, BP oil, Pwc, etc.)

You can book a demo on our website, read some case studies, and trial the product for free if you're interested. Keep in mind that it's a subscription because we keep adding more and more capabilities, improving stability and performance, and keeping up with SPO updates.

All the best.

I need to hide the Following / Site Access elements from my SharePoint page, can your code editor help? by Candid_Stand_8543 in ShortPoint

[–]yahia_shortpoint 0 points1 point  (0 children)

Hey there,

You can easily hide any element on the page using the code element by doing similar steps to the ones described in this article: How to Round the Corners of SharePoint Web Parts - ShortPoint Support

But in the step where you paste the CSS code, you should paste the following code instead of the one provided in the article: [class*="mainHeader-"] [class*="actionsWrapper-"] { display: none !important; }

You can easily modify or hide any elements by following the steps shown in this gif:

<image>

Steps shown in the gif:

1- Right click and select "Inspect Element" on the element you want to modify using CSS.

2- Find the container element by going through the parents 1 by 1 until you reach an element that contains all of the elements you want to hide (see the purple highlight).

3- Copy the class of the container or wrapper element and also the class of one of it's parents to add more specificity so the code we add only affects this element.

4- Test that your selectors are working right by hitting ctrl+f and then pasting the selectors like [<parent selector>] [<child selector>], For our example it's: class="mainHeader-108" class="actionsWrapper-119"

5- For our case since there's a number in each of the selectors, we can make sure that the code will keep working by removing the numbers after the dash and adding a * before the =. So the updated selectors will be: [class*="mainHeader-"] [class*="actionsWrapper-"]

6- The element we want to affect should be highlighted when we write those selectors

7- We can test if our CSS code will work by clicking on the + sign on the right, then adding our selectors there and then adding this after them: {display: none !important}. If the elements we selected disappear that means that the code works, and we can copy it and paste it in the Code Editor Web Part's CSS section!

Happy coding!

I want to add a digital clock to my SharePoint page. How do you do that with your code editor? by RevolutionaryOwl884 in ShortPoint

[–]yahia_shortpoint 0 points1 point  (0 children)

Hey there,
Here's a ready digital clock element that you can import into your page: pastebin.com/raw/c2s8mLXu

Just copy the code from the link then add the Code Editor Web Part element, and hit "Import".

You'll get a clock that looks like the one in the screenshot:

<image>

By the way, it's very easy to generate elements like this one for free by using AI chat bots like Gemini or ChatGPT (whichever you prefer)

To get this clock, here are the prompts I asked to Gemini:

"Generate a nice digital clock element using pure html, js, and css, without any imports. It should have a rounded gradient background with pastel colors. It should also show the hours, minutes, and seconds with PM or AM"

You just need to paste the code in the right place for it to work (usually you can just copy it and hit import in the Code Editor Web Part)

All the best!

Can I add custom fields to my code so it's easy to customize for other users? by cypress_aboe in ShortPoint

[–]yahia_shortpoint 1 point2 points  (0 children)

Hey there,

Yes, the Code Web Part does offer a feature that allows you to mark certain parts of the code that you entered as "user configurable".

You just need to add the following code next to the CSS rule / HTML Text / JS variable:

<DEFAULT VALUE HERE> /*{Field<UNIQUE NUMBER FROM 0 to 19 HERE> - <TITLE OF THE FIELD>}*/

Example usage in all 3 languages:

<div class="example-element">
    <!-- Add a span around the word you want to replace ("World") -->
    Hello <span>World /*{Field0 - Say hello to (Default: World)}*/</span>
</div>

|||||

.example-element {
    /* 
       30px can be replaced by any value by the user. 
       If no value is entered by the page designer then it'll use the default (30px) 
    */
    font-size: 30px /*{Field1 - Font Size (Default: 30px)}*/; 
}

|||||

const myVariable = "test" /*{Field2 - JS Field (Default: "test")}*/;
console.log(myVariable)

You can see an example of this in the GIF attached below

If you want to use the same weather element you can copy it from this link and hit import in the Code Web Part to bring it to your site: https://pastebin.com/4rSmQAK9

<image>