Topics

All topics

Client-side development of add-ons

Use the following guidelines when you do the client-side development of the add-on:

  • You should not use default page templates when creating content that will be exported as part of an add-on.
    Default page templates are not exported. Create new page templates when you want to include them in an add-on.
  • You should structure the HTML in a way that it can be styled via an external file.
    Avoid inline styles.
  • Include the CSS resources for the add-on in the package.
    The consumers of the add-on should be able to override or substitute the included CSS resources with custom ones.
  • When referencing JavaScript libraries, you should use the ones shipped with Sitefinity CMS. For example, JQuery.
  • You should link CSS and JavaScript resources in page templates.
    This will facilitate the process of substituting the resources with custom ones. Avoid linking of resources directly from pages or widget templates.
  • Use BEM naming convention to name CSS classes.
  • Set CSS classes to all HTML tags to ensure the add-on widgets can be easily styled or the add-on widgets’ styles can be easily overridden, if conflicts with client’s styles occur.
  • Style the add-on widget templates using a frontend framework only if you are sure that your clients use this frontend framework.
    Otherwise, you will create an overhead, when your clients need to add a frontend framework to style the add-on widgets. Do not rely on a frontend framework, if you are not sure whether there will be cases, when the add-on will be used in projects that do not use the frontend framework.
  • Do not link CSS file(s) in the add-on widget templates. You should advise your clients to link the CSS file(s) in the <head> tag of the page or add it to the rest of the project’s CSS.
  • If any styling conflicts with the client’s project occur, advice clients to override add-on CSS in a separate file and not directly in the add-on CSS.
NEW TO SITEFINITY?

Want to learn more?

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?

Next article

Best practices: Testing