Pages

When creating a new page, one of the first things you might want to do is to assign an appropriate template for it. To do this, go inside the page backend and locate the section on the right called Page Attributes. Bridge comes with a variety of templates to choose from:

• Default Template - Choose this one if you wish to create a standard page with a boxed layout.
• Blog Large Image
• Blog Large Image Whole Post
• Blog Masonry
• Blog Masonry Full Width
• Blog Small Image - These templates are all meant for displaying blog posts.
• Contact Page - This is the template to use for your "contact us" page.
• Full Screen Sections - This template gives you the ability to create full screen sections on your page. When viewers scroll, the entire section scrolls down and takes them to the next section.
• Full Width - Choose this one if you wish to create a standard page with elements that go across full width of the page.
• Landing Page - This template is like the Full Width template, except that it hides the header and footer.
• Woo Commerce - Choose this one if you wish to create a shop.

Now that you've chosen a template, let's go over the custom fields.

Please note that any settings you save here will override the global settings you've set in Qode Options. It is generally a good practice to set up the look of your pages on a global level, and then override settings on a local level, if necessary.

This will save you a lot of time, unlike if you were to set up every page locally.

Qode General

• Page Background Color - Choose a background color for your page
• Page Transition - Choose a type of Ajax transition for page loading. Select "No animation" if you want the page to load regularly, without Ajax.
• Layer Slider or Qode Slider Shortcode - If you wish to have a slider on your page, copy and paste the slider shortcode here. You can find the Layer Slider shortcode by going to WP admin panel > LayerSlider WP > All Sliders. As for the Qode Slider, you can find it by going to WP admin panel > Qode Slider > Sliders

Qode SEO Fields

In order to improve your page ranking on search engines, you can fill out the following custom SEO fields:

• SEO Title - Enter a relevant title for your page here.
• SEO Keywords - Enter relevant keywords here, separated by commas.
• SEO Description - Enter a short description for your page.

Qode Header

• Header Skin - You can choose a header style to be applied. "Light" displays white navigation text and the "Light" logo, while "Dark" displays black navigation text and the "Dark" logo. If you want to set a custom color and use the default logo, leave this field empty.
• Initial Header Background Color - Choose a background color to be applied to the header area.
• Initial Header Transparency - Set the transparency level for the header background on a scale of 0 to 1, where 0 is fully transparent and 1 is opaque.

Qode Title

• Don't Show Title Area - You can choose to hide the title area on your page.
• Animations - Choose a way to animate the title area upon page load. "Text right to left" will make title text slide in from the right side of the page and then settle into position. "Title area top to bottom" will make the title area gradually unfold. Select "No animation" to have a static page title area.
• Don't Show Title Text - You can choose to hide the title text on your page.
  • Title Text Alignment - Choose an alignment for the title text.
  • Title Text Style - Define styles for the title text.
• Background Color - Choose a background color for the title area.
• Don't Show Background Image - You can choose to hide the background image on your page.
  • Background Image - Choose an image for the title area background. For optimal viewing, we recommend that your image is in full HD resolution of 1920 pixels in width.
  • Pattern Overlay Image - If you wish to use a pattern over the title area, upload it here. This image will be repeated to cover the entire title area.
  • Responsive Background Image - Choose "Yes" if you want to make the title image responsive. Note that title area height will be defined by height of the image after it resizes to fit the browser's width.
  • Parallax Background Image
    • Choose "Yes" if you want title image to have parallax effect.
    • Choose "Yes, with zoom out" if you want viewers to have a perception of zooming out of the image, along with the parallax.
      Your image should be larger than the title area, in order to be able to shrink and not have any gaps appearing at the sides of the page. We recommend a width of 2500 pixels and a height that's at least 20% more than the title area height. The parallax image will be limited in height by title area height (any excess will be cropped). We recommend that your image is at least this height, in order for the parallax effect to work properly.
  • Title Height - Enter a height for the title area in pixels.
  • Separator Under Title Text - Choose "Yes" if you want a separator to appear under title text.
  • Separator Color - Choose a color for the separator.
  • Enable Breadcrumbs Choose "Yes" if you want breadcrumbs to appear in the title area.
    • Breadcrumbs Color - Choose a color for breadcrumb text.
    • Subtitle Text - Enter a subtitle for your page here.
    • Subtitle Text Color - Choose a color for subtitle text.

Qode Content Bottom

• Show Content Bottom Area - Choose "Yes" to enable the content in the bottom area on your page.
• Background Color - Choose a background color for the content bottom area.
• Custom Widget - Choose a custom widget area to display in the content bottom.
• Display in Grid - Choose "Yes" if you want the content bottom area to be fitted in a fixed, centrally positioned grid.
• Qode Blog - This section applies when you're using one of the blog templates.
• Blog Category - You can choose which category of blog posts to display. Leave this field empty to display all categories.
• Number of Posts - You can enter the number of posts to display.
• Show Comments - Choose "Yes" if you want to show the number of comments in the blog post info bar.

Qode Sidebar

• Layout - You can choose a sidebar layout for your page.
• Choose Widget Area in Sidebar - Choose a custom widget area to display in your sidebar.

Full Screen Sections

Since this page template is quite specific, we will cover its features now:

• Full screen sections are created by adding Row elements.
• When editing the Row element, you need to select "Row" under Row Type and "Yes" under the Use Row as Full Screen Section field.
• You can add any content within rows. Content in each section will be vertically centered.
• These pages do not have a title area, and you cannot add a Qode Slider or Layer Slider at the top of the page.

Note: This template currently doesn't support Ajax, and so you would need to have Ajax disabled for this page in order for it to display properly (for information on how to disable Ajax, see Qode Options > General > Settings of this user guide). However, we plan on implementing Ajax in future theme updates.