{"id":92,"date":"2026-03-04T08:09:52","date_gmt":"2026-03-04T08:09:52","guid":{"rendered":"https:\/\/versana.codoplex.com\/web-technologies\/"},"modified":"2026-03-05T16:56:37","modified_gmt":"2026-03-05T16:56:37","slug":"versana-theme-options-guide","status":"publish","type":"post","link":"https:\/\/versana.codoplex.com\/versana-blog\/2026\/03\/04\/versana-theme-options-guide\/","title":{"rendered":"Versana Theme Options: Complete Guide to Every Setting and Feature"},"content":{"rendered":"\n<p>Master all Versana theme options. Configure header, footer, blog layouts, integrations, and optimizations. Complete settings guide.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Introduction to Versana Theme Options<\/h2>\n\n\n\n<p>While the WordPress Site Editor handles visual customization (colors, fonts, layouts), Versana Theme Options control functional settings like:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Header and footer behavior<\/li>\n\n\n\n<li>Blog and archive layouts<\/li>\n\n\n\n<li>Third-party integrations (Google Analytics, etc.)<\/li>\n\n\n\n<li>Performance optimizations<\/li>\n\n\n\n<li>Advanced CSS customization<\/li>\n<\/ul>\n\n\n\n<p>Think of it this way:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Site Editor<\/strong> = How it looks<\/li>\n\n\n\n<li><strong>Theme Options<\/strong> = How it works<\/li>\n<\/ul>\n\n\n\n<p>In this guide, we&#8217;ll explore every tab and setting in Versana Theme Options so you can configure your site exactly how you need it.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Accessing Theme Options<\/h2>\n\n\n\n<p><strong>Location<\/strong>: Appearance \u2192 Theme Options<\/p>\n\n\n\n<p>You&#8217;ll see a tabbed interface with:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Header<\/li>\n\n\n\n<li>Footer<\/li>\n\n\n\n<li>Blog<\/li>\n\n\n\n<li>Integrations<\/li>\n\n\n\n<li>Optimizations (if Companion plugin active)<\/li>\n\n\n\n<li>Advanced<\/li>\n<\/ul>\n\n\n\n<p>Each tab contains related settings. Let&#8217;s explore them all.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Header Tab<\/h2>\n\n\n\n<p>Controls your site&#8217;s header behavior and appearance.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Header Layout<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Header Layout dropdown<\/p>\n\n\n\n<p><strong>Options<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Default (Logo Left, Menu Right)<\/strong>: Traditional layout, logo on left, navigation menu on right. Best for most sites.<\/li>\n\n\n\n<li><strong>Centered (Logo &amp; Menu Centered)<\/strong>: Logo centered above menu, menu items centered below. Best for minimal, creative sites.<\/li>\n<\/ul>\n\n\n\n<p><strong>When to use each<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Default: Business sites, blogs, e-commerce<\/li>\n\n\n\n<li>Centered: Portfolios, photographers, minimal designs<\/li>\n<\/ul>\n\n\n\n<p><strong>How to change<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Select your preferred layout<\/li>\n\n\n\n<li>Click &#8220;Save Settings&#8221;<\/li>\n\n\n\n<li>View your site &#8211; header updates immediately<\/li>\n<\/ol>\n\n\n\n<p><strong>Note<\/strong>: You can further customize header in Site Editor \u2192 Template Parts \u2192 Header<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Sticky Header<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: &#8220;Make header stick to top on scroll&#8221; checkbox<\/p>\n\n\n\n<p><strong>What it does<\/strong>: When enabled, header remains visible at top of screen when scrolling down. Users can always access navigation without scrolling back up.<\/p>\n\n\n\n<p><strong>Benefits<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Improved navigation accessibility<\/li>\n\n\n\n<li>Professional appearance<\/li>\n\n\n\n<li>Better user experience on long pages<\/li>\n\n\n\n<li>Higher conversion rates (always-visible CTA)<\/li>\n<\/ul>\n\n\n\n<p><strong>Considerations<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Uses slightly more screen space on mobile<\/li>\n\n\n\n<li>Can distract on very short pages<\/li>\n\n\n\n<li>Disabled by default (less intrusive)<\/li>\n<\/ul>\n\n\n\n<p><strong>Recommendation<\/strong>: Enable for business sites, corporate sites, e-commerce. Disable for blogs where reading flow is priority.<\/p>\n\n\n\n<p><strong>How to enable<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Check the &#8220;Sticky Header&#8221; box<\/li>\n\n\n\n<li>Save settings<\/li>\n\n\n\n<li>Scroll down any page &#8211; header sticks to top<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Footer Tab<\/h2>\n\n\n\n<p>Configure footer functionality and copyright information.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Back to Top Button<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: &#8220;Show back to top button&#8221; checkbox<\/p>\n\n\n\n<p><strong>What it does<\/strong>: Adds a floating button (usually bottom-right corner) that scrolls user back to top of page when clicked.<\/p>\n\n\n\n<p><strong>When it appears<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>User scrolls down more than one screen height<\/li>\n\n\n\n<li>Button fades in<\/li>\n\n\n\n<li>Click button \u2192 smooth scroll to top<\/li>\n\n\n\n<li>Button fades out at top<\/li>\n<\/ul>\n\n\n\n<p><strong>Benefits<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Better user experience on long pages<\/li>\n\n\n\n<li>Encourages content exploration<\/li>\n\n\n\n<li>Professional touch<\/li>\n\n\n\n<li>Standard on modern sites<\/li>\n<\/ul>\n\n\n\n<p><strong>Enabled by default<\/strong>: Yes<\/p>\n\n\n\n<p><strong>How to disable<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Uncheck &#8220;Show back to top button&#8221;<\/li>\n\n\n\n<li>Save settings<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Copyright Text<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Text input field for footer copyright<\/p>\n\n\n\n<p><strong>Default<\/strong>: <code>\u00a9 {year} {site_name}. All rights reserved.<\/code><\/p>\n\n\n\n<p><strong>Dynamic Placeholders<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>{year}<\/code>: Automatically updates to current year<\/li>\n\n\n\n<li><code>{site_name}<\/code>: Replaced with your site&#8217;s name<\/li>\n<\/ul>\n\n\n\n<p><strong>Examples<\/strong>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\u00a9 {year} {site_name}. All rights reserved.\n\nCopyright {year} by {site_name}. Powered by WordPress.\n\n{year} {site_name}. Built with Versana Theme.\n\n\u00a9 2020-{year} {site_name}. Licensed under CC BY 4.0.<\/code><\/pre>\n\n\n\n<p><strong>Best Practices<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Keep it simple and professional<\/li>\n\n\n\n<li>Always include year placeholder (auto-updates)<\/li>\n\n\n\n<li>Include site name placeholder<\/li>\n\n\n\n<li>Optional: Add theme credit<\/li>\n\n\n\n<li>Check annually that it updated<\/li>\n<\/ul>\n\n\n\n<p><strong>How to customize<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Enter your preferred text<\/li>\n\n\n\n<li>Use {year} and {site_name} placeholders<\/li>\n\n\n\n<li>Save settings<\/li>\n\n\n\n<li>Check footer on your site<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Blog Tab<\/h2>\n\n\n\n<p>Control blog and archive page layouts.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Blog Layout<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Blog Layout dropdown<\/p>\n\n\n\n<p><strong>Options<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Standard List<\/strong>: Traditional single-column blog layout. Posts stacked vertically, full-width within content area.<\/li>\n\n\n\n<li><strong>Two Columns Grid<\/strong>: Posts in 2-column grid. More compact, fits more posts above fold.<\/li>\n\n\n\n<li><strong>Three Columns Grid<\/strong>: Posts in 3-column grid. Magazine-style, maximum content density.<\/li>\n<\/ul>\n\n\n\n<p><strong>When to use each<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>List<\/strong>: Long-form content, detailed excerpts, traditional blogs<\/li>\n\n\n\n<li><strong>2 Columns<\/strong>: Balanced layout, visual content, modern design<\/li>\n\n\n\n<li><strong>3 Columns<\/strong>: Lots of content, image-heavy, news\/magazine sites<\/li>\n<\/ul>\n\n\n\n<p><strong>Preview before deciding<\/strong>: Check how your actual post titles and images look in each layout.<\/p>\n\n\n\n<p><strong>Affects<\/strong>: Homepage blog section (if showing posts), category archives, tag archives<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Sidebar Position<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Sidebar Position dropdown<\/p>\n\n\n\n<p><strong>Options<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Right Sidebar<\/strong>: Sidebar on right, content on left. Traditional.<\/li>\n\n\n\n<li><strong>Left Sidebar<\/strong>: Sidebar on left, content on right. Less common.<\/li>\n\n\n\n<li><strong>No Sidebar (Full Width)<\/strong>: No sidebar, content spans full width. Modern, minimal.<\/li>\n<\/ul>\n\n\n\n<p><strong>When to use<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Right<\/strong>: Most sites, traditional blogs, expected by users<\/li>\n\n\n\n<li><strong>Left<\/strong>: Uncommon, use for specific design reasons<\/li>\n\n\n\n<li><strong>None<\/strong>: Modern minimalist sites, long-form content, distraction-free reading<\/li>\n<\/ul>\n\n\n\n<p><strong>What goes in sidebar<\/strong>: Using widgets or Site Editor \u2192 Template Parts \u2192 Sidebar, add:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Recent posts<\/li>\n\n\n\n<li>Categories<\/li>\n\n\n\n<li>Tag cloud<\/li>\n\n\n\n<li>Search<\/li>\n\n\n\n<li>Newsletter signup<\/li>\n\n\n\n<li>Ad space<\/li>\n<\/ul>\n\n\n\n<p><strong>How to populate sidebar<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Go to Appearance \u2192 Editor<\/li>\n\n\n\n<li>Templates \u2192 Single Post or Archive<\/li>\n\n\n\n<li>Add\/edit sidebar blocks<\/li>\n\n\n\n<li>Save<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Archive Layout<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Archive Layout dropdown<\/p>\n\n\n\n<p><strong>Options<\/strong>: Same as Blog Layout (List, 2 Columns, 3 Columns)<\/p>\n\n\n\n<p><strong>Applies to<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Category archives<\/li>\n\n\n\n<li>Tag archives<\/li>\n\n\n\n<li>Date archives<\/li>\n\n\n\n<li>Author archives<\/li>\n<\/ul>\n\n\n\n<p><strong>Separate from Blog Layout<\/strong>: You can have:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Blog homepage: 3 columns<\/li>\n\n\n\n<li>Category archives: Standard list<\/li>\n\n\n\n<li>Or any combination<\/li>\n<\/ul>\n\n\n\n<p><strong>Recommendation<\/strong>: Match blog layout for consistency, or use slightly different layout to differentiate homepage from archives.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Integrations Tab<\/h2>\n\n\n\n<p>Connect third-party services to your site.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Google Analytics<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Text input for Google Analytics ID<\/p>\n\n\n\n<p><strong>Formats Accepted<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Google Analytics 4<\/strong>: G-XXXXXXXXXX<\/li>\n\n\n\n<li><strong>Universal Analytics<\/strong>: UA-XXXXXXX-X (legacy, still works)<\/li>\n<\/ul>\n\n\n\n<p><strong>What it does<\/strong>: Automatically adds Google Analytics tracking code to your site. Tracks:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Page views<\/li>\n\n\n\n<li>User behavior<\/li>\n\n\n\n<li>Traffic sources<\/li>\n\n\n\n<li>Conversions<\/li>\n\n\n\n<li>Demographics<\/li>\n<\/ul>\n\n\n\n<p><strong>How to get tracking ID<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Go to analytics.google.com<\/li>\n\n\n\n<li>Create account\/property<\/li>\n\n\n\n<li>Copy tracking ID (starts with G- or UA-)<\/li>\n\n\n\n<li>Paste in Theme Options<\/li>\n\n\n\n<li>Save settings<\/li>\n<\/ol>\n\n\n\n<p><strong>Verify it&#8217;s working<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Visit your site<\/li>\n\n\n\n<li>Open Google Analytics<\/li>\n\n\n\n<li>Go to Real-Time \u2192 Overview<\/li>\n\n\n\n<li>You should see your visit<\/li>\n<\/ol>\n\n\n\n<p><strong>Privacy consideration<\/strong>: Add privacy policy mentioning Google Analytics usage.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Google Tag Manager<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Text input for GTM container ID<\/p>\n\n\n\n<p><strong>Format<\/strong>: GTM-XXXXXX<\/p>\n\n\n\n<p><strong>What it is<\/strong>: Container for all tracking codes (analytics, ads, pixels, etc.). Manage all tracking in one place without editing code.<\/p>\n\n\n\n<p><strong>Benefits over direct Analytics<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Add\/remove tracking without code changes<\/li>\n\n\n\n<li>Centralized management<\/li>\n\n\n\n<li>Advanced tracking (scroll depth, clicks, etc.)<\/li>\n\n\n\n<li>Easier for non-technical users<\/li>\n<\/ul>\n\n\n\n<p><strong>How to get container ID<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Go to tagmanager.google.com<\/li>\n\n\n\n<li>Create account and container<\/li>\n\n\n\n<li>Copy container ID (GTM-XXXXXX)<\/li>\n\n\n\n<li>Paste in Theme Options<\/li>\n\n\n\n<li>Save<\/li>\n<\/ol>\n\n\n\n<p><strong>Adds code to<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;head&gt;<\/code> section<\/li>\n\n\n\n<li>Right after <code>&lt;body&gt;<\/code> tag<\/li>\n<\/ul>\n\n\n\n<p><strong>Use GTM OR Analytics directly, not both<\/strong> (or you&#8217;ll double-count visits).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Facebook Pixel<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Text input for Facebook Pixel ID<\/p>\n\n\n\n<p><strong>Format<\/strong>: 15-16 digit number<\/p>\n\n\n\n<p><strong>What it does<\/strong>: Tracks visitors for Facebook Ads:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Retargeting campaigns<\/li>\n\n\n\n<li>Conversion tracking<\/li>\n\n\n\n<li>Audience building<\/li>\n\n\n\n<li>Ad performance measurement<\/li>\n<\/ul>\n\n\n\n<p><strong>How to get Pixel ID<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Go to business.facebook.com<\/li>\n\n\n\n<li>Business Settings \u2192 Data Sources \u2192 Pixels<\/li>\n\n\n\n<li>Create pixel or copy existing ID<\/li>\n\n\n\n<li>Paste in Theme Options<\/li>\n\n\n\n<li>Save<\/li>\n<\/ol>\n\n\n\n<p><strong>Verify installation<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Install Facebook Pixel Helper (Chrome extension)<\/li>\n\n\n\n<li>Visit your site<\/li>\n\n\n\n<li>Extension icon shows green checkmark if working<\/li>\n<\/ol>\n\n\n\n<p><strong>Privacy<\/strong>: Disclose pixel usage in privacy policy. May require cookie consent banner in EU.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Header Scripts<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Textarea for custom scripts in <code>&lt;head&gt;<\/code><\/p>\n\n\n\n<p><strong>Who can access<\/strong>: Only administrators with <code>unfiltered_html<\/code> capability<\/p>\n\n\n\n<p><strong>What it&#8217;s for<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Custom tracking codes<\/li>\n\n\n\n<li>Third-party integrations<\/li>\n\n\n\n<li>Meta tags<\/li>\n\n\n\n<li>Schema markup<\/li>\n\n\n\n<li>Font loading scripts<\/li>\n<\/ul>\n\n\n\n<p><strong>Security restriction<\/strong>: Not visible to editors\/authors (security precaution)<\/p>\n\n\n\n<p><strong>Example uses<\/strong>:<\/p>\n\n\n\n<p>html<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- Hotjar Tracking --&gt;\n&lt;script&gt;\n    (function(h,o,t,j,a,r){...})(window,document,...);\n&lt;\/script&gt;\n\n&lt;!-- Custom Meta Tags --&gt;\n&lt;meta name=\"twitter:creator\" content=\"@username\"&gt;\n\n&lt;!-- Preload Critical Font --&gt;\n&lt;link rel=\"preload\" href=\"\/fonts\/font.woff2\" as=\"font\" type=\"font\/woff2\" crossorigin&gt;<\/code><\/pre>\n\n\n\n<p><strong>Best practice<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Include <code>&lt;script&gt;<\/code> or other tags as needed<\/li>\n\n\n\n<li>Test thoroughly after adding<\/li>\n\n\n\n<li>Document what each script does<\/li>\n\n\n\n<li>Remove unused scripts<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Footer Scripts<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Textarea for custom scripts before <code>&lt;\/body&gt;<\/code><\/p>\n\n\n\n<p><strong>Similar to Header Scripts<\/strong>, but loads at bottom of page.<\/p>\n\n\n\n<p><strong>Better for<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Analytics that can load last<\/li>\n\n\n\n<li>Chat widgets<\/li>\n\n\n\n<li>Non-critical scripts<\/li>\n\n\n\n<li>Scripts that don&#8217;t need to load immediately<\/li>\n<\/ul>\n\n\n\n<p><strong>Why footer is better<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Doesn&#8217;t block page rendering<\/li>\n\n\n\n<li>Faster initial load<\/li>\n\n\n\n<li>Better PageSpeed scores<\/li>\n<\/ul>\n\n\n\n<p><strong>Recommendation<\/strong>: Put scripts in footer unless they specifically need to be in header.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Optimizations Tab<\/h2>\n\n\n\n<p><em>Available when Versana Companion plugin is active<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Lazy Load Images<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: &#8220;Enable lazy loading for images&#8221; checkbox<\/p>\n\n\n\n<p><strong>What it does<\/strong>: Images load only when user scrolls near them, not all at once on page load.<\/p>\n\n\n\n<p><strong>How it works<\/strong>: Uses WordPress native lazy loading (<code>loading=\"lazy\"<\/code> attribute). No JavaScript required. Supported by all modern browsers.<\/p>\n\n\n\n<p><strong>Benefits<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Faster initial page load (50-70% faster typical)<\/li>\n\n\n\n<li>Less bandwidth used<\/li>\n\n\n\n<li>Better mobile performance<\/li>\n\n\n\n<li>Improved PageSpeed scores (+10-20 points)<\/li>\n\n\n\n<li>Better user experience<\/li>\n<\/ul>\n\n\n\n<p><strong>What gets lazy loaded<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>All post\/page images<\/li>\n\n\n\n<li>Featured images<\/li>\n\n\n\n<li>Gallery images<\/li>\n\n\n\n<li>Pattern images<\/li>\n\n\n\n<li>Widget images<\/li>\n<\/ul>\n\n\n\n<p><strong>What doesn&#8217;t get lazy loaded<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Above-the-fold images (first screenful)<\/li>\n\n\n\n<li>Background images in CSS<\/li>\n\n\n\n<li>Images in <code>&lt;picture&gt;<\/code> tags<\/li>\n<\/ul>\n\n\n\n<p><strong>Enabled by default<\/strong>: Yes<\/p>\n\n\n\n<p><strong>When to disable<\/strong>: Almost never. Maybe for:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Above-fold hero images (but WordPress skips these anyway)<\/li>\n\n\n\n<li>Sites with all critical images above fold<\/li>\n\n\n\n<li>Troubleshooting load issues<\/li>\n<\/ul>\n\n\n\n<p><strong>Performance impact<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Without: 100 images load on page load = slow<\/li>\n\n\n\n<li>With: 5-10 images load initially = fast<\/li>\n\n\n\n<li>Others load as needed = seamless<\/li>\n<\/ul>\n\n\n\n<p><strong>Recommendation<\/strong>: Keep enabled always.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Advanced Tab<\/h2>\n\n\n\n<p>For developers and power users.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Custom CSS<\/h3>\n\n\n\n<p><strong>Setting<\/strong>: Textarea for custom CSS code<\/p>\n\n\n\n<p><strong>What it&#8217;s for<\/strong>: Add CSS that overrides or extends theme styles.<\/p>\n\n\n\n<p><strong>Examples<\/strong>:<\/p>\n\n\n\n<p>css<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/* Custom button color *\/\n.wp-block-button__link {\n    background-color: #FF5722;\n}\n\n\/* Wider content area *\/\n.wp-site-blocks {\n    padding-left: 2rem;\n    padding-right: 2rem;\n}\n\n\/* Custom heading style *\/\nh2 {\n    border-left: 4px solid #1A73E8;\n    padding-left: 1rem;\n}<\/code><\/pre>\n\n\n\n<p><strong>Important<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Don&#8217;t include <code>&lt;style&gt;<\/code> tags (just CSS)<\/li>\n\n\n\n<li>Changes apply site-wide immediately<\/li>\n\n\n\n<li>Survives theme updates<\/li>\n\n\n\n<li>Can be overridden by plugins<\/li>\n\n\n\n<li>Check syntax (invalid CSS breaks styling)<\/li>\n<\/ul>\n\n\n\n<p><strong>Testing custom CSS<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Add CSS<\/li>\n\n\n\n<li>Save<\/li>\n\n\n\n<li>View site<\/li>\n\n\n\n<li>Check in different browsers<\/li>\n\n\n\n<li>Test on mobile<\/li>\n<\/ol>\n\n\n\n<p><strong>Debugging<\/strong>: If site styling breaks:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Remove recent CSS<\/li>\n\n\n\n<li>Save<\/li>\n\n\n\n<li>Add back piece by piece<\/li>\n\n\n\n<li>Find problematic code<\/li>\n<\/ol>\n\n\n\n<p><strong>Alternative<\/strong>: Site Editor \u2192 Styles \u2192 Additional CSS (same thing, different interface)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Reset Options<\/h3>\n\n\n\n<p><strong>Feature<\/strong>: &#8220;Reset to Defaults&#8221; button<\/p>\n\n\n\n<p><strong>What it does<\/strong>: Resets ALL theme options to default values. Like fresh installation.<\/p>\n\n\n\n<p><strong>What gets reset<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Header layout and settings<\/li>\n\n\n\n<li>Footer settings<\/li>\n\n\n\n<li>Blog layouts<\/li>\n\n\n\n<li>All integrations<\/li>\n\n\n\n<li>Custom CSS<\/li>\n\n\n\n<li>Every theme option<\/li>\n<\/ul>\n\n\n\n<p><strong>What doesn&#8217;t reset<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Content (posts, pages)<\/li>\n\n\n\n<li>Media<\/li>\n\n\n\n<li>Site Editor customizations<\/li>\n\n\n\n<li>Plugin settings<\/li>\n\n\n\n<li>WordPress core settings<\/li>\n<\/ul>\n\n\n\n<p><strong>When to use<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Starting over with configuration<\/li>\n\n\n\n<li>Troubleshooting weird behavior<\/li>\n\n\n\n<li>Testing default settings<\/li>\n\n\n\n<li>Cleaning up after experimentation<\/li>\n<\/ul>\n\n\n\n<p><strong>Warning<\/strong>: Cannot be undone! Backup settings first if you might want them back.<\/p>\n\n\n\n<p><strong>How to reset<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Click &#8220;Reset to Defaults&#8221; button<\/li>\n\n\n\n<li>Confirm in popup<\/li>\n\n\n\n<li>All options reset immediately<\/li>\n\n\n\n<li>Reconfigure as needed<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Theme Options Best Practices<\/h2>\n\n\n\n<p><strong>Do&#8217;s<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Save after every change<\/li>\n\n\n\n<li>Test changes on live site<\/li>\n\n\n\n<li>Document custom CSS<\/li>\n\n\n\n<li>Use placeholders in copyright<\/li>\n\n\n\n<li>Enable optimizations<\/li>\n<\/ul>\n\n\n\n<p><strong>Don&#8217;ts<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Don&#8217;t add invalid code to scripts fields<\/li>\n\n\n\n<li>Don&#8217;t use both Analytics and GTM for same tracking<\/li>\n\n\n\n<li>Don&#8217;t disable lazy loading without reason<\/li>\n\n\n\n<li>Don&#8217;t forget privacy policies for tracking<\/li>\n\n\n\n<li>Don&#8217;t reset options without backing up<\/li>\n<\/ul>\n\n\n\n<p><strong>Configuration Workflow<\/strong>:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Import demo (if desired)<\/li>\n\n\n\n<li>Configure header (layout, sticky)<\/li>\n\n\n\n<li>Configure footer (copyright, back to top)<\/li>\n\n\n\n<li>Set blog layouts<\/li>\n\n\n\n<li>Add tracking codes<\/li>\n\n\n\n<li>Enable optimizations<\/li>\n\n\n\n<li>Test everything<\/li>\n\n\n\n<li>Add custom CSS if needed<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Troubleshooting Theme Options<\/h2>\n\n\n\n<p><strong>Settings not saving<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Check browser console for errors<\/li>\n\n\n\n<li>Disable caching temporarily<\/li>\n\n\n\n<li>Try different browser<\/li>\n\n\n\n<li>Check file permissions<\/li>\n<\/ul>\n\n\n\n<p><strong>Scripts not working<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Verify syntax (no typos)<\/li>\n\n\n\n<li>Check browser console for errors<\/li>\n\n\n\n<li>Ensure unfiltered_html capability<\/li>\n\n\n\n<li>Test scripts outside WordPress first<\/li>\n<\/ul>\n\n\n\n<p><strong>Layout not changing<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Clear cache (browser and plugins)<\/li>\n\n\n\n<li>Hard refresh (Ctrl\/Cmd + Shift + R)<\/li>\n\n\n\n<li>Check that you saved<\/li>\n\n\n\n<li>Verify correct tab\/setting<\/li>\n<\/ul>\n\n\n\n<p><strong>Tracking not working<\/strong>:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Verify ID format (G-XXX or UA-XXX-X or GTM-XXX)<\/li>\n\n\n\n<li>Check in tracking platform&#8217;s real-time view<\/li>\n\n\n\n<li>Clear cache<\/li>\n\n\n\n<li>Test in incognito window<\/li>\n\n\n\n<li>Check browser ad blockers<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Next Steps<\/h2>\n\n\n\n<p>You now understand all Versana theme options:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Configure header and footer<\/strong> for your needs<\/li>\n\n\n\n<li><strong>Set blog layouts<\/strong> that match your content<\/li>\n\n\n\n<li><strong>Add tracking codes<\/strong> for analytics<\/li>\n\n\n\n<li><strong>Enable optimizations<\/strong> for performance<\/li>\n\n\n\n<li><strong>Customize with CSS<\/strong> if needed<\/li>\n<\/ol>\n\n\n\n<p><strong>Remember<\/strong>: Theme options control functionality. Site Editor controls appearance. Use both for complete customization.<\/p>\n\n\n\n<p><strong>Questions?<\/strong> Check our documentation or support forums.<\/p>\n\n\n\n<p>Master these settings and your Versana site will work exactly how you want! \u2699\ufe0f<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Master all Versana theme options. Configure header, footer, blog layouts, integrations, and optimizations. Complete settings guide.<\/p>\n","protected":false},"author":1,"featured_media":84,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,16],"tags":[19,29,32,34],"class_list":["post-92","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-documentation","category-tutorials","tag-configuration","tag-settings","tag-theme-options","tag-versana-features"],"_links":{"self":[{"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/posts\/92","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/comments?post=92"}],"version-history":[{"count":1,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/posts\/92\/revisions"}],"predecessor-version":[{"id":135,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/posts\/92\/revisions\/135"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/media\/84"}],"wp:attachment":[{"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/media?parent=92"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/categories?post=92"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/versana.codoplex.com\/versana-blog\/wp-json\/wp\/v2\/tags?post=92"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}