All About Dynamic Website Builder
All About Dynamic Website Builder
DOJODIGI Team
Contents:
Benefits
Features
Building Your Website & Website Builder Fundamentals
Connecting Your Domain
Website Settings & Analytics
Best Practices
In this digital-first landscape, a website is a unique online space, extending your reach beyond local borders and a local audience. Beyond visibility and connecting your brand to potential customers, partners, and investors, your website also acts as a strategic platform and a 24/7 sales agent for your business. In this article, we will go through DOJODIGI's dynamic website builder and everything related to your websites built on DOJODIGI.
How DOJODIGI's Dynamic Website Builder Benefits Your Business:
Ease of Use: The user-friendly interface allows anyone to build and manage a professional website without technical expertise.
Professional Appearance: Over 1000+ customizable templates to ensure your website looks professional and aligns with your brand identity.
Improved Online Presence: SEO tools and responsive design enhance your online visibility and user experience, driving more traffic to your site.
Increased Sales: E-commerce integration and secure SSL certificates provide a seamless shopping experience, boosting sales and customer trust.
Data-Driven Decisions: Advanced analytics help you understand visitor behavior and make informed decisions to improve your site’s performance.
Global Reach: Build your site and cater to a diverse audience, expanding your reach and market potential.
Our Features:
Drag-and-Drop Builder:
Create stunning websites with ease using the intuitive drag-and-drop interface. No coding skills required.
Customizable Templates:
Choose from over 1000+ of professionally designed templates tailored to different industries, ensuring your website looks polished and professional.
Responsive Design:
Ensure your website looks great on all devices, from desktops to smartphones, with responsive design features.
SEO Tools:
Boost your website's visibility with built-in SEO tools that help you optimize your content for search engines.
E-commerce Integration:
Seamlessly integrate e-commerce functionalities to sell products and services directly from your website. Read more on our Ecommerce features here.
Advanced Analytics:
Gain insights into your website’s performance with detailed analytics and reporting tools.
Blogging Platform:
Engage your audience with a built-in blogging platform to share updates, news, and articles.
Building Your Website & Website Builder Fundamentals (Specific to DOJODIGI)
Navigation
Head to the Sites tab and navigate to the websites page
View and edit all the sites built on DOJODIGI from here.
Create folders for better organisation of your websites
Use the search bar to search for your websites
Click on the time icon to rearrange the website display according to chronological order
Click on create website
Choose between our 1000+ professionally designed templates or create one from scratch!
Explore DOJODIGI's vast library of over 1000+ professionally designed website templates. Whether you're looking for a sleek, modern design or something more traditional, our library has you covered.
Professionally Designed: All our templates are crafted by expert designers to ensure they are visually appealing and user-friendly.
Easy to Find: Choose your perfect template by browsing categories, types, and tags tailored to your needs.
Flexible and Customizable: Each template is fully customizable to match your brand's identity and requirements.
Time-Saving: With ready-to-use templates, you can launch your website quickly and efficiently.
Hover over the template of your choice and click on the view button on its top right to preview the template
If you would like to proceed with this template, click on continue. If not, head back and choose another
Website Builder Fundamentals
When you're in the website builder you'll see a similar layout as displayed below
We'll be going through the icons on the top left as boxxed
NOTE: The general layout order will be Sections > Rows(with columns) > Elements(your texts, images etc)
All the sections, rows and elements can be dragged an dropped from here to your site
We'll be going down this list first, starting with sections.
Sections
Sections are the building blocks of your website layout. They define the overall structure and can be customized to different widths:
Full Width: Spans the entire width of the page, ideal for large images or banners.
Wide: Slightly narrower than full width, perfect for showcasing featured content.
Medium: Provides a balanced look, suitable for text and smaller images.
Small: Compact sections used for specific content or sidebars.
These customizations allow you to control how your content is displayed across various devices and screen sizes.
Rows
Within a section, you add rows to organize your content further. Rows are horizontal containers within sections that help in structuring your page content:
Single Row: Used for simple, single-element layouts.
Columns: You can have up to 6 columns in a row by default. For more than 6 columns, insert a 6-column row and duplicate a column to achieve your desired layout.
Rows help you arrange content logically and aesthetically within each section.
Elements
Elements are the actual content blocks within rows. Here's a table outlining the various elements available in DOJODIGI's Website Builder and their brief descriptions:
Global Sections
Global sections, such as headers and footers, are elements that appear consistently across multiple pages. Editing a global section updates it across all instances where it is used, ensuring consistency and saving time.
Section Templates
DOJODIGI's section templates are pre-designed sections that you can use to quickly build your website. To create a section template:
Design your section with all desired elements.
Hover over the section and save the section as a template by clicking the copy button on the right of the highlighted section
Reuse this template across different pages to maintain a consistent look and feel.
Online Store
Turn any website into an ecommerce store! Store pages in DOJODIGI are categorized separately from normal site pages to streamline e-commerce management. This separation ensures that product listings, categories, and checkout processes are handled efficiently and don't interfere with the main website content. Store pages are designed with e-commerce functionalities in mind, providing a seamless shopping experience for customers. Read more on our Ecommerce features here.
Page Layers
Page Layers refer to the hierarchy and arrangement of sections, rows, and elements on your page. Think of it as the structure or skeleton of your webpage.
You can rearrange them to change the order of how elements appear on your site:
Sections: The top-level layers.
Rows: Nested within sections.
Elements: Contained within rows.
Rearranging these layers allows you to modify the layout and visual hierarchy of your content.
Pop-Up Settings
In the Pop-Up Settings, you can edit and rearrange your pop-ups to enhance user engagement.
This includes:
Design Customization: Adjust the appearance of pop-ups.
Behavioral Settings: Control when and how pop-ups appear (e.g., on page load, exit intent, or after a certain time).
This feature helps in targeting users more effectively with relevant messages.
Tracking Code
Tracking Codes are snippets of code used to collect data about website visitors for analytics and marketing purposes:
Header Tracking Code: Placed in the header, it runs as soon as the page loads.
Footer Tracking Code: Placed in the footer, it runs after the main content loads.
These codes are essential for tracking user behavior, conversion rates, and more.
Custom CSS
Custom CSS allows you to add your own CSS code to further style your website:
Purpose: Customize the appearance beyond the built-in options.
Impact: Changes will apply across the entire site wherever the CSS selectors match.
This is useful for advanced styling and ensuring your site adheres to specific brand guidelines.
Typography Settings
The icon to the right of custom CSS is the Typography Settings that enable you to standardize font styles and colors across your entire site:
Global Font Choices: Set default fonts for headings, paragraphs, and other text elements.
Color Settings: Define standard colors for text.
This ensures consistency and enhances the visual coherence of your site.
Website Background
In the Website Background settings, you can insert a background image for your entire site:
Customization: Choose images that complement your site's theme and branding.
Visual Appeal: A well-chosen background can enhance user experience and engagement.
SEO Settings
SEO Settings are crucial for optimizing your site for search engines:
SEO Preview: View how your site will appear in search results.
Content Editing: Modify the title, description, keywords, author, and social image.
Social Image: An image that appears when your site is shared on social media.
Custom Meta Tags: Add custom meta tags for additional SEO customization.
Canonical Links: Prevent duplicate content issues by specifying the preferred URL.
Preview Custom Codes
The icon next to SEO Meta Data is the Preview Custom Codes feature that allows you to see how your custom HTML, CSS, or JavaScript code will affect your website before making it live. Note, it will not show as the finished code on DOJODIGI's site builder so you will have to preview it.
Cookie Consent
Cookie Consent banners are used to inform visitors about cookie usage and obtain their consent:
Enable Banner: Add a cookies banner to your site.
Customization: Edit the font, settings, and appearance of the banner.
Functionality: Prevent marketing, performance, and analytics cookies from loading before consent is given.
This helps comply with privacy regulations like GDPR and builds trust with your visitors.
Website Builder Layout
Click on this icon to toggle between always having a fixed element editing/settings column or to only show the settings when a section, row or element is selected.
Edit Different Pages
Click on the drop down to navigate to another site page to edit
Editing Content (sections, rows, elements)
To edit an element, section, or row, simply click on it. This will open a settings column on the left side of your screen where you can make your changes.
For layout editing, adjustments can be made directly in the main editor column.
Settings Column
The settings column usually has a general settings page and an advanced settings page.
Here are some general settings for the elements and what they do:
Here are some advanced settings and what they do:
Do note that depending on the element you are editing, some of the general settings may be found under advanced settings and vice versa.
Connecting Your Domain
Activate Domain: If you configured the templated website in the steps above and want to send it live on a domain, follow the instructions below.
Disclaimer: If your website url is currently being used with an existing website, following the steps below will replace your existing website with a DOJODIGI website (or funnel).
Go to “Settings” -> “Domains”
Enter your desired domain or sub-domain in the “Enter Domain Name” field (this will be something.yourdomain.com or yourdomain.com.
Click the “Add & Verify” button
Click the “Continue” button to connect your domain. Depending on your domain registrar, you’ll either be prompted to connect and login with your domain registrar so the wizard can automatically configure the new DNS records or you’ll be prompted to manually configure those records in your DNS.
Click the “Verify Domain” button to verify the status. Once the record has been verified, you’ll be prompted to select a website and default homepage for this domain.(Note: DNS record verification often takes several minutes to complete, so you may have to click “Verify Domain” a few times until all the records are found).
Your domain is now ready to be connected to your DOJODIGI website!
Head to the websites page of the sites tab, click on the site you wish to edit
Click on "settings" and input your connected domain
Remember to click save at the bottom
Website Settings & Analytics
In the websites page of the sites tab, click on the site you wish to edit
In "Pages", manage and customize each page of your site, tailoring content and design to fit your needs.
in "Stats", analyze the performance of your website by viewing detailed statistics for each page.
Analytics can also be viewed from the analytics page in the sites tab. Click on the drop downs to select which website to display stats for.
In "Sales", monitor your website sales in this section. For version 2 of funnels and websites, you can view sales under the Payments tab in the Orders & Transactions page.
In "Security", configure and manage security headers for your site. Security headers enhance the protection of your website by instructing browsers on how to handle content security. Learn more here.
In "Events", you can send tracking events data to Meta. This involves using Pixel ID, Conversion API, and Access Token to track and optimize your site's performance on Meta platforms.
Pixel ID: A unique identifier for tracking user interactions on your website.
Conversion API: Enables server-to-server tracking of events, improving data accuracy and privacy.
Access Token: Authenticates and secures the data sent to Meta.
In "Settings",
Edit your site's essential information and configurations, including:
Site Name: The name of your website.
Domain: Your website's web address.
Path: Specific subdirectory or subdomain for organizing content.
Tracking Codes: Codes used to monitor site activity and gather analytics.
Favicon URL: The small icon that appears in the browser tab next to your site’s name.
Head to settings -> media and open media library.
Upload your favicon if you have not.
Click on the uploaded favicon and copy the link by clicking the link icon on the top right
Paste the link into the favicon settings section
Payment Mode: Enable or disable the payment functionality.
Image Optimization: Enhances image loading speeds by optimizing file sizes.
Optimize JavaScript: Improves site performance by optimizing JavaScript files.
GDPR Compliant Fonts: All pages in the funnel will be using GDPR compliant fonts instead of Google Fonts
Chat Widget: Enable live chat functionality on your site for better customer interaction. Read more on our chat widget here.
Remember to save your changes after editing.
Preview & Publish
In the website builder, click on the preview or publish icons.
Best Practices
ALWAYS SAVE YOUR WORK PERIODICALLY
Utilize the built-in SEO tools to optimize your website for search engines.
Preview your website to ensure everything looks perfect.
Contact us at [email protected] for any queries you may have. At DOJODIGI, we pride ourselves in customer support & satisfaction.
