Theme customization

[DarioForte]

We bought a theme from you. Tell me how you can configure our site as this site: https://www.gitomer.com/

[ruenel]

Hello Ildar,

Thanks for writing in!

Please be advised that the example url has been customized with custom html contents and css codes to style the site. Do you want to copy the whole layout structure from header down to the footer below?

Stack:

• He uses Integrity stack. You can set this in X > Theme Options > Stack.

Topbar:

• He is using a custom html code to display a three column top bar. All of this can now be possible if you use a global block if you are not familiar with html. Simply go to X > Global Blocks and create a block that resembles the layout. Once you are done, take note of the Global Block shortcode. You can then use that shortcode and insert it in X > Theme Options > Header > Top > Topbar Content.

Header:

• He use “Stacked” layout for the header. You can set this in X > Theme Options > Header > Logo and Navigation > Layout.
• He only uses a text logo which can be inserted in X > Theme Options > Header >Logo - Text. And then he added the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r) to hide the logobar

.x-logobar {
    display: none;
}

• For the navigation, he added a custom css for the last menu item so that it will look more like of a button than a menu item. He used this following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

#menu-item-5968 a {
    background: #fff;
    color: #AB0201;
    transition: 0.1s;
    border: 0!important;
    outline: 0;
}

#menu-item-5968 a:hover {
    background: #750000;
    color: #ffffff;
    transition: 0.1s;
    border: 0!important;
    outline: 0;
}

where 5968 is the menu item ID. If you ever want this for your site, you must figure out the menu item ID of the last menu item in your navigation. To find the menu item ID, please right click on the page on your site and select “inspect element” and scroll down until you find code like this.

You can also go to Appearance > Menus and hover your mouse pointer over the Remove or Cancel link for each menu item.

Content:

• You can create your page content by editing the page in Cornerstone. You might need to get familiar with it first. Please check out this documentation: https://theme.co/docs/builders-101, https://theme.co/docs/adding-elements or simply the docs site here: https://theme.co/docs/

Footer:

• The footer is using 4 column footer widget areas. You can enable this in X > Theme Options > Footers. You also have the settings to enable the menu and footer content.

Hope this helps. Please let us know how it goes.

[DarioForte]

@ruenel

Please be advised that the example url has been customized with custom html contents and css codes to style the site. Do you want to copy the whole layout structure from header down to the footer below?

We are interested in its site structure. Mostly blog structure. Thanks for the instruction.

[christian]

Hey Ildar,

Its blog structure is highly customized. If you can code (mainly PHP), you can learn how to customize our theme from our Customizations and Developer Resources articles in our Themeco Docs.

If you can’t work with code, you will need to hire a developer to achieve the exact functionality as your sample site. Please note that we do not provide customization as part of our theme support.

This is not to achieve the setup like in your sample site but just letting you know that we have free bundled grid plugins so our users have an alternative in case they don’t want the theme’s blog design or want a customized blog listing. Please visit the links below for more details and plugin usage instructions.

• The Grid: Demos | Bundled Plugin Documentation
• Essential Grid: Demos | Bundled Plugin Documentation

Hope that helps and thank you for understanding.