How can we help you today?

Custom CSS Tab for ShortPoint Design Elements

Use Custom CSS tab of your ShortPoint Design Element to add more customization to it. You can also make it possible/impossible to copy the page design to other pages.



TABLE OF CONTENTS


Before we begin

  • Basic knowledge of CSS is required. Check our basic and advanced tutorials on how to use Custom CSS. 
  • You can use Settings and/or Advanced tabs to improve the look features of your Design Elements without using Custom CSS.

Customizing ShortPoint Design Element


Write your CSS code in the Custom CSS field. 


Important: Please, note that you don't need to add declarations for the current Design Element, since the class for it will be auto-generated at runtime, and might be changed whenever you edit your page.



For more information, visit our solution tutorials on Custom CSS:


Check our Custom CSS solutions folder. There you will find a bunch of already created Custom CSS codes for various ShortPoint Design Elements.


Advanced options

You can add ID and Class attributes to your ShortPoint Design Elements. These options are useful to:

  • apply the CSS that overrides your previously set settings or added custom CSS codes (use either ID or Class attribute);
  • be accessed from JavaScript (use either ID or Class attribute);
  • allow copying this Design Element (use Class attribute);
  • disable copying whole page design (use Class attribute).

Adding ID attribute


Type ID attribute name to ID field.



Adding Class attribute


Type the Class attribute name to Class field.



Note: to provide multiple CSS class names to the same Design Element, separate them with a space (e.g: class-1 class-2 will add class-1 and class-2 as two separate CSS classes).

Allow Copying ShortPoint Design Element

To allow copying the current ShortPoint Design Element, use the CSS Class name shortpoint-copy



By using this Class name, other users will be able to copy this Design Element, and the whole page design.


Find out more about Copy & Paste feature, by checking these solution articles:


Disable Copying Whole Page Design


To disable copying the whole page design, add the CSS Class name shortpoint-disable-copy-all



By adding this Class to only one ShortPoint Design Element on the page, copying the whole page design will be disabled.


Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 7 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more