Articles in this section
Authenticate Emails with SPF, DKIM, and SenderID Auto-forwarding your emails to Vtiger Automate Outgoing Emails in Email Settings Automation - Approvals Automation - Assignment Rules Automation - Multi-path Workflows Automation - Scheduled Workflows Automation - Scheduler Automation - Standard Workflows Automation - Webforms Automation - Workflow Action - Create Event Automation - Workflow Action - Create Records Automation - Workflow Action - Create Task Automation - Workflow Action - Invoke Custom Function Automation - Workflow Action - SMS Task Automation - Workflow Action - Send Mail Automation - Workflow Action - Update Fields Automation - Workflow Action - Webhook Automation - Workflows - Vtiger Expressions Configuration - Business Hours Configuration - Company Details Configuration - Consents Configuration - Customer Portal Configuration - Maps Configuration - Usage Details Configure Encrypted data fields in Vtiger CRM Configure Picklist Dependencies Considerations for Deactivating Vtiger Users Control Fields and Record Displays using Configuration Editor Create Reminders for Records and Inbox Create a field of a Grid type Dealing with Currencies and Taxes Enable Desktop Notifications on Chrome Web Browsers Extensions - Extension Store IMAP Configuration - 2-way sync between Vtiger and IMAP providers Inventory - Payments and Subscriptions Inventory - Tax Management Inventory - Terms and Conditions Login to Vtiger on SSO SAML using ADFS Mailroom Functionality in Different Scenarios Manage Multiple Currencies Marketing & Sales - Forecast and Quota Settings Marketing & Sales - Pipelines and Stages Marketing and Sales - Deal to Project Mapping Marketing and Sales - Lead Conversion Data Mapping Marketing and Sales - Profile Scoring Module Management - Labels Editor Module Management - Module Numbering My Preferences My Preferences - Calendar Settings My Preferences - My Tags My Preferences - Notification Preferences SAML Support in Vtiger CRM Set up Mailroom Settings - Configure Module Settings Settings - Create Dynamic Fields and Layouts Module Management - Creating a Relationship Between Modules Settings - Customize Records and Fields for your Business Settings - How to set email autoresponder to Webform submission? Settings - Left Menu Settings - Manage Global Picklists in Vtiger Settings - Set up your Support Team Settings - Start Up Page Settings - Working with Picklist Values Module Management - Module Builder Support - SLA Policies Troubleshooting Login Issues Unsubscribe your Email User Management - Authentication User Management - Encrypted Field Access Logs User Management - Groups User Management - Login History User Management - Profiles User Management - Roles User Management - Settings Log User Management - Sharing Rules User Management - Users User Management - Vtiger Support Access Vtiger Buzz - Chrome Extension for Notifications Vtiger Implementation wizard Vtiger Language Support Websense - Trackers Websense - Widgets Configuration - Storage Guard Adding a local DNS Entry Adding Additional Hidden Fields to a Webform Configuring Dependent Fields and Blocks for Modules Duplicate Prevention in Modules Module Management - Modules Module Management - Module Layouts & Fields

Customize your self-service portal theme using CSS styles

B
Bindu Rekha Babu
21 Sep, 2020 - Updated 11 months ago

Introduction

Vtiger provides an option to change the default theme of the menu bar appearing in the Portal. To do so, you just need to create a CSS file as per your business requirement and upload the CSS file to your server. After you upload, copy - paste the URL into the Customer Portal settings page.

Sample of a CSS

Say, you have to change the color of the Menu bar from Black to Gold because your logo is not visible. Create a CSS file in the following format.

.menu .navbar.navbar-inverse { background: #FFD700 !important; }

Save the file and upload it to your server to generate a URL(eg, https://grasspods-doc.od2.vtiger.com/portal_css_sample.css). Copy-paste the URL in Vtiger Customer Portal, to see the changes in Portal.

Default Theme

alt text

Customized Theme

alt text

You can choose the color code from the following website - https://www.w3schools.com/cssref/css_colors.asp

Home Privacy Policy Terms of Service Security Center Policy & Legal Center Contact Us
© Copyright 2021 Vtiger. All rights reserved.
Powered by Vtiger
Facebook Twitter Linkedin Youtube