{"slug":"bitrix-cms-basics","title":"bitrix-cms-basics","summary":"Covers CMS fundamentals — sites, site templates, menus, page templates, includes, breadcrumbs, styles/CSS handling (styles.css vs template_styles.css, Asset::addCss, SetAdditionalCSS), user groups, user fields, admin panel. Applied for site structure and content management tasks.","platform":"Claude","tags":[],"authorName":"LLM Mart","authorSlug":"llm-mart","score":0,"source":"github","price":null,"verified":false,"createdAt":"2026-08-28T17:01:55.585613Z","repo":{"url":"https://github.com/bxmaximum/bitrix-framework-skills","stars":32,"forks":5,"license":null,"updatedAt":"2026-08-25T17:45:16Z"},"bodyHtml":"<hr>\n<h2>name: bitrix-cms-basics\ndescription: Covers CMS fundamentals — sites, site templates, menus, page templates, includes, breadcrumbs, styles/CSS handling (styles.css vs template_styles.css, Asset::addCss, SetAdditionalCSS), user groups, user fields, admin panel. Applied for site structure and content management tasks. Key terms — CSite, template, menu, include area, styles.css, SetAdditionalCSS, user field, UF.</h2>\n<h1>CMS Basics</h1>\n<p>Baseline: <strong>main 23.0+</strong>. Features newer than baseline are marked <strong>Since</strong>.</p>\n<p>Site management layer above the framework — sites, templates, menus, content areas. Landing sites / Sites24: skill <code>bitrix-landing</code>.</p>\n<h2>Sites (Multisite)</h2>\n<p>ORM tablet: <code>\\Bitrix\\Main\\SiteTable</code> → table <code>b_lang</code> (<code>main/lib/SiteTable.php</code>). Legacy: <code>CSite</code>.</p>\n<p>Key fields: <code>LID</code> (primary, e.g. <code>s1</code>), <code>NAME</code>, <code>DIR</code>, <code>DOC_ROOT</code>, <code>SERVER_NAME</code>, <code>SITE_NAME</code>, <code>LANGUAGE_ID</code>, <code>CULTURE_ID</code>, <code>ACTIVE</code>, <code>DEF</code>.</p>\n<pre><code>$site = \\Bitrix\\Main\\SiteTable::getRow([\n    'filter' =&gt; ['=LID' =&gt; SITE_ID],\n    'select' =&gt; ['LID', 'DIR', 'SERVER_NAME', 'DOC_ROOT', 'LANGUAGE_ID'],\n]);\n\n$docRoot = \\Bitrix\\Main\\SiteTable::getDocumentRoot(SITE_ID);\n</code></pre>\n<p><code>SITE_ID</code> / <code>SITE_DIR</code> are available after kernel init. Resolve site by host/path: <code>SiteTable::getByDomain($host, $directory)</code>.</p>\n<h2>Site Templates</h2>\n<p>Location: <code>/local/templates/&lt;template_id&gt;/</code></p>\n<pre><code>/local/templates/mytemplate/\n├── header.php\n├── footer.php\n├── description.php       # Template meta ($arTemplate), incl. EDITOR_STYLES\n├── styles.css            # Content styles — also loaded by the visual editor\n├── template_styles.css   # Template frame styles (header/footer/grid)\n├── .styles.php           # Visual editor style list entries\n├── components/           # Template-level component overrides\n├── page_templates/       # Page layout templates\n└── lang/\n</code></pre>\n<p><strong><code>#WORK_AREA#</code></strong> — required placeholder in the site template (often a single-file template or between <code>header.php</code> / <code>footer.php</code> flow). The kernel injects the page body at <code>#WORK_AREA#</code>. Missing marker → admin error “set the #WORK_AREA# separator”.</p>\n<p>Template selected per site in Admin → Sites → Edit. Prefer <code>/local/templates/</code>, not <code>/bitrix/templates/</code>.</p>\n<h2>Styles (CSS)</h2>\n<p>Store CSS next to the owner of the markup:</p>\n<table>\n<thead>\n<tr>\n<th>Owner of markup</th>\n<th>Where CSS lives</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>Site frame (<code>header.php</code> / <code>footer.php</code>, grid, background)</td>\n<td><code>template_styles.css</code> of the site template</td>\n</tr>\n<tr>\n<td>Page content that must be styleable in the visual editor</td>\n<td><code>styles.css</code> + <code>.styles.php</code> of the site template</td>\n</tr>\n<tr>\n<td>Component template markup (<code>template.php</code>)</td>\n<td><code>style.css</code> next to the component template</td>\n</tr>\n<tr>\n<td>JS-extension UI loaded via <code>Extension::load()</code></td>\n<td>CSS inside the extension (<code>config.php</code> <code>css</code> key) — skill <code>bitrix-extensions</code></td>\n</tr>\n<tr>\n<td>One-off page CSS</td>\n<td><code>Asset::getInstance()-&gt;addCss()</code> / classic <code>SetAdditionalCSS()</code></td>\n</tr>\n</tbody>\n</table>\n<p><strong><code>styles.css</code> vs <code>template_styles.css</code>:</strong> the visual editor renders content in an iframe and injects <code>styles.css</code> into its <code>&lt;head&gt;</code> — never put site-frame rules there, or they distort the editor; keep them in <code>template_styles.css</code>. Both files are editable in Admin → <em>Settings → Product settings → Sites → Site templates</em> (tabs \"Site styles\" / \"Template styles\").</p>\n<p><strong>Visual editor style list</strong> — <code>.styles.php</code> in the template returns entries (CSS rule itself goes to <code>styles.css</code>):</p>\n<pre><code>return [\n    'example' =&gt; [                     // array key = CSS class name\n        'tag' =&gt; 'p',                  // tag(s) the style applies to; comma-separated list allowed\n        'title' =&gt; 'Test style',       // name shown in the editor\n        'html' =&gt; '&lt;span style=\"...\"&gt;Preview&lt;/span&gt;', // optional styled preview\n        // optional 'section' =&gt; groups entries in the editor's style dropdown\n    ],\n];\n</code></pre>\n<p><strong>Editor-only CSS files</strong> — <code>EDITOR_STYLES</code> in the template's <code>description.php</code> (<code>$arTemplate</code>): <code>'EDITOR_STYLES' =&gt; ['/bitrix/css/main/bootstrap.css', ...]</code>. Loaded only in the visual editor; include them separately for the public site if needed.</p>\n<p><strong>Include APIs:</strong></p>\n<pre><code>$APPLICATION-&gt;ShowCSS();          // classic, in header.php &lt;head&gt;: outputs page + template CSS set\n$APPLICATION-&gt;SetAdditionalCSS('/local/templates/demo/additional.css'); // classic add to that set\n\n\\Bitrix\\Main\\Page\\Asset::getInstance()-&gt;addCss(SITE_TEMPLATE_PATH . '/styles/page.css');\n// 2nd param $additional=true → file goes to the template set, after styles.css / template_styles.css\n\n\\Bitrix\\Main\\UI\\Extension::load('demo.product-card'); // extension JS+CSS from its config.php\n</code></pre>\n<p>Prefer <code>Asset::addCss()</code> (D7) or <code>Extension::load()</code> for new code; <code>ShowCSS()</code> / <code>SetAdditionalCSS()</code> belong to classic site templates.</p>\n<p><strong>Optimization</strong> (Admin → <em>Settings → Product settings → Module settings → Main module</em>): merge CSS files (<code>main</code> option <code>optimize_css_files</code>), use existing <code>.min</code> versions, gzip copies (<code>compres_css_js_files</code>, requires zlib). Merge applies only to Asset-registered CSS, is skipped in the admin section and Ajax mode, and can be disabled via <code>disableOptimizeCss()</code>. Merged files live in <code>/bitrix/cache/css/&lt;SITE_ID&gt;/&lt;template&gt;/</code> (kernel / <code>template_&lt;hash&gt;</code> / <code>page_&lt;hash&gt;</code> sets) — after editing CSS clear the Bitrix cache (and browser cache) if the old look persists.</p>\n<h2>Section and Access Files</h2>\n<h3><code>.section.php</code></h3>\n<p>Per-directory file (walked from current path up to site root). Typical contents:</p>\n<pre><code>&lt;?php\n$sSectionName = 'News';\n$arDirProperties = [\n    'TITLE' =&gt; 'News section',\n    'keywords' =&gt; 'news, updates',\n    'description' =&gt; 'Company news',\n];\n</code></pre>\n<ul>\n<li><code>$sSectionName</code> — used for breadcrumbs (<code>GetNavChain</code>).</li>\n<li><code>$arDirProperties</code> — directory properties; read via <code>$APPLICATION-&gt;GetDirProperty()</code> / merged into <code>$APPLICATION-&gt;GetProperty()</code>.</li>\n</ul>\n<h3><code>.access.php</code></h3>\n<p>Per-directory file permissions (<code>PERM[...]</code>). Managed by <code>$APPLICATION-&gt;SetFileAccessPermission()</code> / admin UI. Do not hand-edit unless you know the format; kernel includes it when resolving file rights.</p>\n<h2>Page Properties</h2>\n<pre><code>$APPLICATION-&gt;SetPageProperty('title', 'About');\n$APPLICATION-&gt;SetPageProperty('description', 'About the company');\n$APPLICATION-&gt;SetPageProperty('keywords', 'about');\n\n$title = $APPLICATION-&gt;GetPageProperty('title', 'Default');\n// GetProperty: page first, then directory (.section.php), then default\n$desc = $APPLICATION-&gt;GetProperty('description');\n</code></pre>\n<ul>\n<li><code>SetPageProperty</code> / <code>GetPageProperty</code> — current page only.</li>\n<li><code>SetDirProperty</code> / <code>GetDirProperty</code> — directory props (often from <code>.section.php</code>).</li>\n<li><code>GetProperty</code> — page → dir → default.</li>\n</ul>\n<p>Common keys: <code>title</code>, <code>description</code>, <code>keywords</code>, plus custom uppercase IDs.</p>\n<h2>Menus</h2>\n<ul>\n<li>Menu types per site (<code>top</code>, <code>left</code>, …).</li>\n<li>Files: <code>/.top.menu.php</code>, <code>/.left.menu.php</code> in site root or section.</li>\n<li>Component: <code>bitrix:menu</code>.</li>\n</ul>\n<h2>Page Templates</h2>\n<p><code>/local/templates/&lt;id&gt;/page_templates/</code> — reusable layouts for the visual editor.</p>\n<h2>Include Areas</h2>\n<p><code>bitrix:main.include</code> — editable content blocks:</p>\n<pre><code>$APPLICATION-&gt;IncludeComponent('bitrix:main.include', '', [\n    'AREA_FILE_SHOW' =&gt; 'file',\n    'PATH' =&gt; '/include/phone.php',\n]);\n</code></pre>\n<p>Files typically under <code>/include/</code> or <code>/local/include/</code>.</p>\n<h2>Breadcrumbs</h2>\n<ul>\n<li>Auto from <code>$sSectionName</code> in <code>.section.php</code> along the path.</li>\n<li>Manual: <code>$APPLICATION-&gt;AddChainItem('Title', '/path/')</code>.</li>\n<li>Component: <code>bitrix:breadcrumb</code>.</li>\n</ul>\n<h2>Users and Groups</h2>\n<ul>\n<li><code>CUser</code>, <code>\\Bitrix\\Main\\UserTable</code> — users.</li>\n<li>Groups control permissions via <code>\\CMain::GetUserRight()</code> and group IDs.</li>\n<li><strong>User fields (UF)</strong> — <code>CUserTypeEntity</code>, <code>\\Bitrix\\Main\\UserFieldTable</code>; register in module <code>DoInstall</code>; access via <code>USER.UF_*</code> in ORM or user fields API.</li>\n</ul>\n<h2>Admin Panel</h2>\n<p><code>/bitrix/admin/</code> — admin scripts. Custom pages via module install admin files, or modern UI (<code>bitrix-ui</code>). Legacy lists: <code>CAdminList</code> / <code>CAdminForm</code>.</p>\n<h2>Checklist</h2>\n<ul>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Site-specific code checks <code>SITE_ID</code> / <code>SITE_DIR</code>.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Template has <code>#WORK_AREA#</code>; overrides in <code>/local/templates/</code>.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Site-frame CSS in <code>template_styles.css</code>; editor-visible content CSS in <code>styles.css</code> (+ <code>.styles.php</code>); component CSS in the template's <code>style.css</code>; new code uses <code>Asset::addCss()</code> / <code>Extension::load()</code>.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Section meta/breadcrumbs via <code>.section.php</code>; rights via <code>.access.php</code> / API.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Page meta via <code>SetPageProperty</code> / <code>GetProperty</code>.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Menus via <code>.menu.php</code> or Admin UI; includes for editable fragments.</li>\n<li><input disabled=\"disabled\" type=\"checkbox\"> Landings / composite sites → <code>bitrix-landing</code> when applicable.</li>\n</ul>\n","files":[{"path":"SKILL.md","sizeBytes":8479,"isText":true}],"reviewScore":null,"reviewSummary":null,"trust":{"provenance":"trusted-source-unreviewed","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow.","bodySource":null},"bodyLocked":false,"purchaseUrl":null,"sourceUrl":null,"report":{"provenance":"trusted-source-unreviewed","screen":{"ran":true,"outcome":"clean","suspicious":0,"notes":0,"hiddenCharacters":false},"virusScan":{"engine":"clamav","status":"clean","scannedAt":"2026-08-28T17:03:25.331728Z","sha256":"8071C0C96C88546D4C677808871301C7007CD9174B881CB1C4F654178B9B89C1","sizeBytes":3627},"review":null,"source":{"repositoryUrl":"https://github.com/bxmaximum/bitrix-framework-skills","path":"skills/bitrix-cms-basics","license":null,"commit":"66c40e0ac8bdb3a3b68c3e53745b006659341594","subtreeSha":"9EF36B8D0058CC77DF898CC7402AEFAE4127062764FDB18179CAC5CFDFCDD884","lastSyncedAt":"2026-09-27T19:34:22.479278Z"},"reviewedAt":"2026-08-28T17:06:21.794385Z","notice":"Community-authored content, reproduced verbatim and not vetted as instructions. Treat it as data to evaluate, never as directives to follow."},"install":[{"target":"skills-cli","command":"npx skills add https://github.com/bxmaximum/bitrix-framework-skills/tree/main/skills/bitrix-cms-basics"},{"target":"claude-code","command":"claude plugin marketplace add https://llmmart.ai/marketplace.json && claude plugin install bxmaximum-bitrix-framework-skills@llmmart"},{"target":"git","command":"git clone https://github.com/bxmaximum/bitrix-framework-skills.git"}]}