How to add custom CSS to the site

← Back

Create a service section with the "Custom CSS" module and access only for administrators — its page has a CSS editor, styles are applied to all site pages.

  1. In the "Site structure" section, click "Add main item", name the section, for example "My CSS".
  2. In the "Module" field via "Select" find the card "Custom CSS" (code custom_css).
  3. "Access level" — "Administrators only". Save.
  4. Open this section. On first open, "Site CSS file created. It is connected on all site pages last." will appear.
  5. Write rules in the editor. Tab — indent, Shift+Tab — remove indent.
  6. Click "Save" or Ctrl+S. Changes are visible on pages after refresh.

The file is connected last on every page, so it overrides engine styles with equal selector specificity. But settings from the block style window (gear) are written directly into the block — only !important overrides them.

The file is stored among site files and is included in the backup and template.

If it didn't work

  • Styles hid or broke the page. Click "Without my CSS" in the editor — it will open without your styles. On any site page, the same is achieved by adding ?nocustomcss=1 to the address (works only for administrator).
  • "File changed". The file was changed in another tab or by another administrator. You can overwrite with your text or cancel, copy the text and refresh the page.
  • "CSS file is too large". The limit is 512 KB. Remove excess; insert images as links, not as code inside CSS.
Did the article help?

See also

How to set a logo and faviconBoth images are uploaded in the settings of the "Logo" informer — using the "Logo" and "Fav icon" fields.How to style a block: border, background, padding, shadowHover over the block and click the gear icon — a styles window will open with the tabs "Border", "Block", "Text", "Links", "Animation", "Positioning".How to add a counter or third-party widget to all pagesThe "About site" tab in general settings, the "Widget HTML code" field — the code is inserted on every page of the site.What are informers in the menuThese are small widgets that sit in the menu alongside items: logo, cart, search, language switcher, chat, and others.

Tips for working with the builder

The "Help" section is made for those who are building a website on "Pervaya Liniya" for the first time. It contains answers to common questions: how to create a website, what to write in the fields, how to edit texts and photos, how to connect your own domain, and how to set up sections. The materials will help you figure things out without contacting support.

The builder is simple: you fill in the fields on the creation page, and then edit the content directly on the finished website. If something does not work or is unclear, check the relevant help item. The instructions are written in plain language and describe every step.

In Help you will find answers to questions:

  • how to come up with a website address and what to do if the name is taken;
  • how to change the title, description, and other texts on the page;
  • how to add products, services, or request forms;
  • how to connect your own domain instead of an address on firstline.com.ua;
  • how to set up sections and modules for your business needs.

If you cannot find the answer you need, use the feedback form — we will help you figure it out. The section is updated so that you can always find current information about working with the builder.