Skip to main content
9 votes

How to Render Javascript per page or component?

An alternative to @Gatogordo's option is to use a modular approach to JavaScript using something like requirejs. I wrote a post about using requirejs to organize your js with Sitecore a while a go. ...
Richard Seal's user avatar
  • 20.5k
6 votes
Accepted

Applying rich text editor custom classes

We encountered the same issue and fixed it in the ToolsFile.xml. Our experience is that the classes section of that file should be empty to have the classes from your attached css file to be imported ...
Gatogordo's user avatar
  • 20.2k
6 votes

Images for different breakpoints

One option is to use sizes srcset on your <img> element. I've recently been a project where this was the approach. Set it up like this. Example from a Razor View. <img src="@Model.ImageUrl" ...
Mark Cassidy's user avatar
  • 25.3k
5 votes
Accepted

How do I replace css background url with @html.Sitecore().field("Header Image")

The code @Html.Sitecore().Field("Header Image") will render a full image tag like: <img src="~/media/imageid.ashx" alt="" /> For the background image, you need to get the Url of the image. ...
Richard Seal's user avatar
  • 20.5k
4 votes

Sitecore Language wise css changes

Better to add class to body tag: <body class="ar"> In code it will be look like: <body class="@Html.Sitecore().GetBodyCssClass()"> public static HtmlString GetBodyCssClass(this ...
Andrei Paliakou's user avatar
4 votes

How to Render Javascript per page or component?

This might be an opinion based question.. but I'll give the approach I usually take. In general I would keep all css and javascript bundled and minified together. This means visitors will load some ...
Gatogordo's user avatar
  • 20.2k
4 votes

Sitecore MVC FieldRenderer.Render - Add and persist inline styles & classes to links in the Experience Editor

Why don't you try to have all styles in the cshtml file instead of having them inline? <style> my-cta-class { Margin: 0; color: white !important; font-family: Helvetica, Arial, ...
AJ -'s user avatar
  • 219
3 votes
Accepted

Sitecore container with variants to change background color

The Container component is not a Variant component, so you can't create variants for it. You have 2 options, the best as has already been mentioned, just add a Style option for the Container component ...
Richard Seal's user avatar
  • 20.5k
3 votes

SXA custom css priority level

In case if you are using SXA AssetService pipeline to programmatically include the whole theme, then there is an SortOrder property which you can use: public class AddCustomTheme: AddAssetsProcessor {...
Dawid Rutkowski's user avatar
3 votes

SXA custom css priority level

Files get concatenated in an order taken from Sitecore tree and then minified, so you can control it using standard sort order field. I am not sure if an order will help you in any way. The standard ...
Alan Płócieniak's user avatar
3 votes
Accepted

Is there a way to put Sitecore Forms fields side by side without CSS

No, there is no other way, you can do that through CSS only. You can make use of the bootstrap components and create a good UI. For the two columns, you need to make use of the section field. Make ...
Nikki Punjabi's user avatar
3 votes

What's an efficient Frontend development process / workflow for Sitecore?

I'll outline what we do as it's working quite well for us: Create a Style Guide which is a simple page in Sitecore that lists all components available to content editors. Use Gulp with Yarn (avoids ...
Adam Seabridge's user avatar
3 votes

How to Render Javascript per page or component?

Sitecore Habitat solution might have what you are looking for. Pipeline: For each rendering you specify a js/css asset or a line of script. In the mvc.getPageRendering pipeline it gathers up all ...
Chris Auer's user avatar
  • 13.1k
2 votes

Apply Css class around <p>, Rich Text Editor - Sitecore 8.2u2

You should be able to do this fairly easily. Go to the root of your site and open up default.css (this comes by default with Sitecore). Add the following at the bottom of the file: p.blue { ...
Adam Seabridge's user avatar
2 votes

Sitecore MVC FieldRenderer.Render - Add and persist inline styles & classes to links in the Experience Editor

This may be beyond the scope of what you want to do to accomplish this, but I would recommend using an ORM like Glass Mapper to strongly-type your models, and then this kind of thing is handled much ...
Dan Sinclair's user avatar
  • 5,394
2 votes

WFFM custom toggle switch

You're rendering the HTML markup directly in your cshtml file, but you need to use the Html Helpers. I suggest you take a look at the default Checkbox field markup located in /Website/Views/Form/...
jammykam's user avatar
  • 13.8k
2 votes

Where to place the CSS file that i want to add for a Sitecore form field

To start using custom styles and scripts in your forms: In the Content Editor, navigate to sitecore/Forms, click the form that you want to add a script or style to and, in the Scripts or Styles field, ...
Sumit Bhatia's user avatar
  • 5,133
2 votes

Rich Text Editor - Apply CSS class around <tr> html tag

You can add a new CSS class in the Rich Text Editor dropdown and apply it to the selected row table. There are two steps to add CSS class in RTE: Add element inWebsite\sitecore\shell\Controls\Rich ...
Himmat Singh Dulawat's user avatar
2 votes

Applying rich text editor custom classes

A method I much prefer for user-friendliness is to create a new paragraph type in the RTE Profile: It looks like this in the Rich Text Editor window: This way you can choose the type of DOM element ...
Marcel Gruber's user avatar
1 vote

Rich Text Editor custom css - how to add classes to the dropdown that aren't displayable in the dropdown?

It seems the css from the custom style is pulled from your custom class and inserted as an inline style on the td element. I had a play around with this and the only way I could get it to work was as ...
Dean OBrien's user avatar
  • 1,635
1 vote

How to add Custom CSS File and why it is not rendering to page

As far as I can see, you have pre-optimized-min item created under the folder to which you try to upload custom styles. Did you re-generate pre-optimize-min file after adding your custom one? If SXA ...
Dawid Rutkowski's user avatar
1 vote

Sitecore container with variants to change background color

If the only difference is the background color I would say follow this guide to handle the styling difference with a checkbox in the properties of a rendering: Add a style for a rendering Scriban ...
Sasha Kachanov's user avatar
1 vote

Checked styles by default

Yes, you can. The steps to take: Determine the GUID of the style you want to select: search the style item in $site/Presentation/Styles Make sure the rendering parameters template of your component ...
Gatogordo's user avatar
  • 20.2k
1 vote

Where to place the CSS file that i want to add for a Sitecore form field

You can below link for Sitecore Form styling - https://doc.sitecore.com/developers/90/sitecore-experience-manager/en/add-styles-and-scripts-to-sitecore-forms.html Sitecore Forms uses css and script ...
Gaurav Agarwal's user avatar
1 vote

Css not reflecting in sitecore modal window

The way you have the code setup, you are bypassing Sitecore and just rendering an MVC View using @Url.Action in a new window. If you want to take that approach, you would need to add a reference to ...
Richard Seal's user avatar
  • 20.5k
1 vote
Accepted

Sitecore Forms CSS Scripts - Dropdown selection

This can be achieved! If you want to change the text field type of "CSS Class" to dropdown, then you can change the change the "Type" (field type) from single-line text to droplink as marked in the ...
Paulson Maclean's user avatar
1 vote

Applying rich text editor custom classes

It should pick up automatically, but you can try to add it to ToolsFile.xml <classes> <class name="Your Class 1" value="your-class-1" /> <class name="Your Class 2" value="your-class-2" ...
Árvai Mihály's user avatar
1 vote

Sitecore MVC FieldRenderer.Render - Add and persist inline styles & classes to links in the Experience Editor

If you don't want to use Glass, judging by this answer on Stack Overflow, it looks like you could do this by incorporating the user-defined styles into the permanent ones you want to add. However, it ...
Dan Sinclair's user avatar
  • 5,394
1 vote

SXA custom css priority level

To get the priority your files should be at the very last. This is so basic, The files are optimized in the sort order of the files in the folder, just place your custom.css at the very last in the ...
Sitecore Sam's user avatar
  • 1,163
1 vote

SXA custom component, Is my component correct?

Looks like you are trying to make a menu. There are some out of box controls for menu items like 'Navigation' or 'Link List', you can use them and then apply rendering variants to achieve your ...
Naveed Ahmad's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible