Buy Now

Configuration

Dox have a lot personalization options. Here you can go through every single one available in our theme and set it up properly.

Introduction

_config.yml stores configuration data. Many of these options can be specified from the command line executable but it’s easier to specify them here so you don’t have to remember them.

Please stop and re-run jekyll serve command after you change configuration file! Master configuration file contains global configurations and variable definitions that are read once at execution time. Changes made to config.yml during automatic regeneration are not loaded until the next execution.

Relative URLs

If you’re deploying to server where your site is not going to be in root directory, you should setup baseurl variable.

For example, if your site is going to be stored on URL that looks like this - http://example.com/project, you’ll have to update your baseurl variable and it should look like this:

dox:
    baseurl: /project

Build site with environment variable! When you run jekyll serve, your baseurl variable shouldn’t render at all in any pages.

We’ll set Jekyll to only render baseurl variable when its environment is set to production.

So then, how do you get the baseurl variable to only show up on a production environment? When building your Jekyll project with jekyll build, you’ll want to prefix it with JEKYLL_ENV=production so the complete command looks like this one: JEKYLL_ENV=production jekyll build

Title

To define your website title you’ll have to update title variable in _config.yml.

It is very important to define this from SEO point of view and usually it will be the name of your project or website.

dox:
    title: Project Name

Theme color

Dox supports any HEX color you want to use.

Basically, every blue area you see by default will be replaced with color you set in theme_color variable.

You can update your theme_color variable in _config.yml to see changes.

dox:
    theme_color: '#197AF4'

Language

The language variable specifies the natural language of the content of a web page. It is important to specify it for a lot of reasons.

Use ISO language and country codes to setup language of your website.

This is example of english used in United States of America:

dox:
    language: en-US

Logo with text

If you need logo as text, update text variable and leave image empty.

dox:
    header:
        logo:
            text: Project name
            image:

Logo with image

If you need logo as image, update image variable and set it to true and leave text empty.

To set your custom logo image just upload it in place of logo.png here /dox-theme/assets/images/layout/logo.png.

dox:
    header:
        logo:
            text:
            image: true

Recommended logo image size. Recommended logo image height is 104px and width is optional. With this size you are sure you'll have retina ready logo image.

To add new items in main navigation you have to setup nav variable in _config.yml. Add as many items as you need.

dox:
    header:
        nav:
            - item_name: Homepage
              item_url: /
            - item_name: Default Layout
              item_url: /default

CTA

To edit CTA button in right corner of your header you should update cta variable in _config.yml.

There are 3 things you can change about your CTA button and below is example of it:

dox:
    header:
        cta:
            label: Documentation
            url: /documentation
            icon: folder

Logo

Logo with text

If you need logo as text, update text variable and leave image empty.

dox:
    footer:
        logo:
            text: Project name
            image:

Logo with image

If you need logo as image, update image variable and set it to true and leave text empty.

To set your custom logo image just upload it in place of logo-footer.png here /dox-theme/assets/images/layout/logo-footer.png.

dox:
    footer:
        logo:
            text:
            image: true

Recommended logo image size. Recommended logo image height is 104px and width is optional. With this size you are sure you'll have retina ready logo image.

If you need to setup new footer copyright text, update text variable in your _config.yml file.

dox:
    footer:
        text: Copyright &copy; 2018. - Project name <br>All rights reserved.

Google Analytics

To activate Google Analytics you have to update _config.yml with GA tracking code. You can do that with tracking_code variable.

dox:
    google_analytics:
        tracking_code: UA-XXXXXX-X

Build site with environment variable! When you run jekyll serve, your Google Analytics tracking code shouldn’t render at all in any pages.

The reason for this is if you visit your Google Analytics account, you’ll see a bunch of visits from localhost:4000 or 127.0.0.1:4000 depending on the type of operating system you’re developing your Jekyll project.

This can potentially muddy up your analytics, so to mitigate this problem, we’ll set Jekyll to only render Google Analytics when its environment is set to production.

So then, how do you get the analytics to only show up on a production environment? When building your Jekyll project with jekyll build, you’ll want to prefix it with JEKYLL_ENV=production so the complete command looks like this one: JEKYLL_ENV=production jekyll build

Disqus comments

To activate Disqus commenting system you have to update _config.yml with Disqus forum shortname. You can do that with disqus_forum_shortname variable.

Comments are available only on default page layout and you have to enable them on new pages with comments: true variable.

dox:
    comments:
        disqus_forum_shortname:

Build site with environment variable! When you run jekyll serve, your Disqus commenting system shouldn’t render at all in any pages.

We’ll set Jekyll to only render Disqus commenting system when its environment is set to production.

So then, how do you get the Disqus commenting system to only show up on a production environment? When building your Jekyll project with jekyll build, you’ll want to prefix it with JEKYLL_ENV=production so the complete command looks like this one: JEKYLL_ENV=production jekyll build

Favicon

To change favicon just replace /favicon.ico with your new icon. Make sure it is in .ico format. Dimensions should be 16px x 16px.

Favicon .psd file included! We've included .psd file with pre-made favicon in /designs folder of your theme.