Tripcart allows you to manage your homepage layout by adding and configuring different content sections. To access these settings, navigate to Dashboard > Website Settings > Website Builder. Below is a detailed guide on the available sections and their respective configuration options.
Hero: #
The Hero section is typically the first thing users see when they visit the homepage. It often showcases high-impact images and introductory text. The Hero section has two settings: Content and Style.
Content Settings #
- Banner Type: Choose between an image or video for the hero banner.
- Image
- Select Image: Upload or select an image to display in the hero section.
- Overlay opacity: Adjust the opacity of the overlay to ensure the text is readable against the image.
- Video
- Video iframe: Insert the iframe link of the video to be displayed in the hero section.
- Title: Enter the main heading for the hero section.
- Description: Provide a brief description or tagline to complement the title.
- Button label: Set the text for the call-to-action button.
- Button URL: Provide the URL where the button should direct users.
- Show Tour Search: Toggle this option to enable or disable the tour search functionality within the hero section.
Style Settings #
The style settings for the Hero section include the following options:
- Alignment : Align content to left, center, or right.
- Title: Adjust the font size of the title.
- Description: Adjust the font size of the description.
- Custom CSS: Add custom CSS to further style the Hero section as per your requirements.
Feature Section: #
Feature Section is designed to highlight specific features or services you offer, allowing you to showcase key aspects of your business in an engaging way. This section can be customized to emphasize your most important offerings. The Feature Section has two main settings: Content and Style.
Content Setting: #
The content settings for the Feature section include the following options:
- Title: Set a prominent title for the feature section that captures attention and conveys the section’s purpose.
- Description: Provide a concise overview of what visitors will discover in the Feature Section. Highlight the available tours, their distinctive offerings, and any other important details that would engage the audience.
- Feature: To add features, click the “+” icon. You can include as many features as you’d like. Simply choose an icon, select the icon color, and provide a compelling title and description for each feature.
#
Style Settings #
Below is the list of style settings:
- Title: Set the font size for the title of the section.
- Description: Set the font size for the description of the section.
- Custom CSS: Add custom CSS code to further customize the appearance of the Feature section beyond the provided settings. This allows for advanced styling options.
Tour Packages: #
The Tour Packages section highlights different travel packages available on your site. This section allows you to showcase various tour packages to attract potential travelers. The Tour Packages section has two main settings: Content and Style.
Content Settings: #
The content settings for the Tour Packages section include the following options:
- Title: Set a prominent title for the Tour Packages section that captures attention and conveys the section’s purpose, such as “Explore Our Top Tours.“
- Description: Briefly describe what visitors can expect from the tour packages. This could include details about the types of tours available, their unique features, or any other relevant information.
- No of Tours: Specify how many tour packages you want to display in this section. This number determines the number of packages that will be showcased on the homepage.
- Tours Filters: There are two filters available. Enable to show filters based on available discounts. This allows visitors to easily find tours that are currently on sale or offer special deals. You can also select the specific tours you want to feature in this section. You can choose from existing tours in your system or add new ones.
- Button label: Set the text for the button that users will click to view more details or take action related to the tour packages, such as “View All Tours.”
- Button URL: Provide the URL to which users will be directed when they click the button. This could link to a page with more information about the tours or a booking page.
Style Settings: #
The style settings for the Tour Packages section include the following options:
- Button Type: Choose the style of the button used in the section. You can choose the Filled option to display the button with a background color or the Ghost option to display the button with a border and transparent background.
- Background Color: Set the background color for the Tour Packages section to match your site’s color scheme and branding.
- Discount Batch Color: Choose the color for the discount badges or labels displayed on tour packages. This highlights the discounts effectively.
- Custom CSS: Add custom CSS code to further customize the appearance of the Tour Packages section beyond the provided settings. This allows for advanced styling options.
Tour Package Templates #
Tripcart provides four different Tour Package templates to display your tours in various formats on the homepage.
Accessing Tour Package Templates #
To view and add a template, follow these steps:
- Navigate to Dashboard > Website Settings > Website Builder
- Click on Add Pre-designed Blocks
- Select Tour Package
- Choose from the available list of templates
Changing the Template #
Once a template is added, you can easily switch between templates by clicking the left or right arrow displayed on the Tour Package section while editing it in the Website Builder.
Destinations #
The Destinations section showcases travel destinations that are available in tours plan. The Destination section has two settings: Content and Style.
Content Settings: #
- Title: Set a prominent title for the feature section that captures attention and conveys the section’s purpose.
- Description: Provide a concise overview of what visitors will discover in the Destination Section. Highlight the available tours, their distinctive offerings, and any other important details that would engage the audience.
- Choose Destination: Select the destination you want to display in this section.
- Destination Button Label: Enter the label for the button in the destination section.
- Button Label: Provide the label for the button that will display a list of additional destinations.
- Button URL: Input the URL of your Destination Archive page.
Style Settings #
- Button Type: Choose the style of the button used in the section. You can choose the Filled option to display the button with a background color or the Ghost option to display the button with a border and transparent background.
- Custom CSS: Add custom CSS code to further customize the appearance of the Destination section beyond the provided settings. This allows for advanced styling options.
Activities #
The Activities section outlines various activities available in your tours or services. The Activities section has two settings: Content and Style.
Content Settings #
- Title: Set a prominent title for the feature section that captures attention and conveys the section’s purpose.
- Description: Provide a concise overview of what visitors will discover in the Activities Section. Highlight the available tours, their distinctive offerings, and any other important details that would engage the audience.
- Choose Activities: Select the Activities you want to display in this section.
- Button Label: Provide the label for the button that will display a list of additional Activities.
- Button URL: Input the URL of your Activities Archive page.
Style Settings #
- Button Type: Choose the style of the button used in the section. You can choose the Filled option to display the button with a background color or the Ghost option to display the button with a border and transparent background.
- Custom CSS: Add custom CSS code to further customize the appearance of the Activities section beyond the provided settings. This allows for advanced styling options.
Call To Action (CTA): #
Call To Action sections are crucial for guiding users toward desired actions, such as signing up for a newsletter, booking a tour, or contacting your business. The CTA section has two settings: Content and Style.
Content Settings: #
Below is a list of content settings:
- Banner Image: Upload an image to be used as the background for the CTA section.
- Overlay Opacity: Adjust the overlay opacity to ensure the text in the CTA section remains clear and readable.
- Title: Enter the title for the CTA section.
- Description: Provide a short description outlining the purpose of this section.
- Button Label: Specify the label for the button.
- Button URL: Input the URL that the button will link to.
Style Settings #
Below is the list of style settings:
- Text Alignment: Select the position for your content display—right, center, or left.
- Title: Set the font size for the title of the section.
- Description: Set the font size for the description of the section.
- Custom CSS: Add custom CSS code to further customize the appearance of the CTA section beyond the provided settings. This allows for advanced styling options.
Blog #
The Blog section is used to display recent posts, articles, or news updates. The Blog section has two settings: Content and Style.
Content Settings #
- Title: Set a prominent title for the Blog section that captures attention and conveys the section’s purpose.
- Description: Provide a concise overview of what visitors will discover in the Blog Section.
- Post Filter: Select the blog filter you want to display in this section.
- Read More Label: Enter the label for the button in the Blog section.
- Button Label: Provide the label for the button that will display a list of additional blog posts.
- Button URL: Input the URL of your blog page.
Style Settings #
- Button Type: Choose the style of the button used in the section. You can choose the Filled option to display the button with a background color or the Ghost option to display the button with a border and transparent background.
- Custom CSS: Add custom CSS code to further customize the appearance of the Blog section beyond the provided settings. This allows for advanced styling options.
About #
The About section provides information about your site. You can a description of your site in more detail. The About section has two settings: Content and Style.
Content Settings #
- Primary Image: Upload the main image for the About Section.
- Image: Upload the secondary image for the About Section.
- Title: Enter the title for the section.
- Description: Provide a detailed description of your site.
- Button Label: Specify the label for the button.
- Button URL: Input the URL for your About page.
Style Settings #
- Image Alignment: Choose whether to display the image on the left or right side.
- Button Type: Select the button style for this section—choose “Filled” for a background color or “Ghost” for a transparent background with a border.
- Title Font Size: Set the font size for the section’s title.
- Description Font Size: Adjust the font size for the section’s description.
- Custom CSS: Add custom CSS code to apply advanced styling and further personalize the appearance of the About section.
Partners and Associations #
The Partners and Associations section highlights your business partners and associations testimonials, which can enhance credibility and showcase professional relationships. The Partners and Associations section has two settings: Content and Style.
Content Settings #
- Title: Enter the title for the section.
- Brand: Click the “+” icon to add a brand. You can upload the brand image, enter the brand name, and provide the brand’s URL. Add as many brands as you’d like by clicking the “+” icon.
Style Settings #
- Title: Set the font size of the title.
- Custom CSS: Add custom CSS code to apply advanced styling and further personalize the appearance of the Client and Partner section.
FAQs Section #
The FAQs (Frequently Asked Questions) section is a crucial part of your Tripcart website. It provides visitors with quick answers to common questions, enhancing user experience and engagement. This section can be customized to fit your specific needs and content.
Accessing the FAQs Section #
- Navigate to the Dashboard: Log in to your Tripcart account and go to the dashboard.
- Click on “Website Builder”: This will take you to the main settings page for your website.
- Select “FAQs Section”: This option is typically found under the “Add Pre-Design Block” settings.
Customizing the FAQs Section #
Once you have accessed the FAQs Section, you can customize it using the following settings:
Content #
- Title: Add a title to your FAQs section. This title will be displayed at the top of the FAQs section on your website. It helps visitors quickly identify the purpose of the section.
- Description: Provide a brief description of what the FAQs section covers. This can include information about the types of questions answered, the purpose of the section, and any other relevant details. This description will help visitors understand the scope and value of the FAQs section.
- Add FAQ: Click on the “Add FAQ” button to add new questions and answers to the FAQs section. This allows you to populate the section with content that addresses common queries from your visitors.
- Text Editor Blocks: In the FAQ Answer text holder, you can add different text editor blocks to format your answers. Click on the Save button after each change to save the content. These blocks include:
- List: Use this block to create bullet points or numbered lists, making it easier to present information in an organized manner.
- Text: Use this block to add paragraphs of text, providing detailed answers to your visitors’ questions.
- Headings: Use this block to add headings and subheadings, helping to structure your answers and make them more readable.
Style #
- Font Size: Set the font size for the question and answer of the FAQ section.
- Animation: Choose the animation style for the FAQ section.
- Animation Speed: Choose slow, medium, or fast speed for the FAQ section.
- Animation Delay: Choose how long after the animation it should be delayed.
- Card Animation: Choose the animation for the card section of the FAQ.
- Add CSS: Add custom CSS code if necessary for any of the FAQ content.
Add Pre-designed block #
You can select a pre-designed block and customize it to fit your needs. Simply search for the desired block design, click on it, and edit as needed.
📧 If you face any issues or have questions, please reach out to our support team or initiate the chat located on the right.