Thank you for buying our theme!

Christine

Documentation



Thank you for buying our theme Christine! Please use this guide to setup your theme and configure it's settings.

If you have any further questions after reading this guide, feel free to contact us at our Support Area


Support includes: Item support does not include:
We'll do our very best to reply as soon as possible!

01. Installation

Theme Requirements

In order to proceed with the theme installation, you need to make sure you have the latest version of WordPress (3.5+) on your self-hosted site.

Theme Installation

  1. Log into your WP Admin and browse for Appearance → Themes.
  2. Now navigate to the secondary tab: Install Themes and click the Upload link option.
  3. Follow the instructions by choosing the file "christine.zip", located in the archive which you have downloaded from the store and click "Install Now" button.
    Note: Do not upload the entire zip file you received after purchase, unzip the "do-not-upload.zip" file first. Within the unzipped folder you'll find another folder with the same theme name (christine.zip). THIS is the zip file you will need to upload to WordPress.
  4. Click Activate link, once the upload has finished, and you are ready for the next steps.

Plugins Installation & Activation

After you activated the Christine Theme you can see a message :
Click on install the required plugins.

  • Install Plugins - On the new page you can select both plugins. Select Install under the Bulk Actions list and click apply.

    After the installations are finished press return to the Required Plugins Installer

  • Activate plugins - After you installed the required plugins you need to activate them. Again, select both plugins, select Activate under the Bulk Actions list and click apply. That's it!

Demo Content Import (optional)

The theme comes with a demo-content.xml file containing demo content you can import into your WordPress site. This will help you get started, in case you are running on a fresh WP installation with no content at all. To upload the demo content follow this steps:

  1. Navigate to Tools → Import.
  2. Click on "WordPress" link (if the Importer plugin is not installed, install it now).
  3. Select the demo-content.xml file located in the files you have downloaded after purchase and click the "Upload file and import" button.
  4. The next page will gives you an option to import the author.
    Make sure to click: "Download and import file attachments" if you want to add the demo images!
  5. Please be patient while WordPress is importing the content, this can take a few minutes.
  6. Your are done! Now your site is populated with demo content.

03. Homepage

Christine comes with a clean and elegant homepage and is packed with options to style it. If you would like to adjust the amount of posts shown per page you can go to Settings > Reading > Blog pages show at most and change the number.

In our demo website we use 3 posts per page (6 post per grid style page).

Optional: To disable the admin bar when you are viewing the website while logged in go to: Users → Your Profile and disable "Show Toolbar when viewing site".

Homepage layout

To change your homepage layout go to: Appearance → Customize → Homepage Layout and for example change the Homepage layout into a Sidebar & Grid Layout.

In our demo website we use this layout but feel free to try out your own new combinations!





04. Widgets + Front Page Featured Slider

To create widgets like our demo website navigate to Appearance → Widgets.

You will see 3 widget areas on the right side; Sidebar, Footer Instagram and Instagram Slider Shortcode Generator

This is how our widget setup looks like:

  • About Widget Displays the "About Me" widget.

    This is the description we use:

    This fashion style blog by Christine is the perfect reflection of the latest trends. In addition to posting photographs of elegant outfits (and enviably impeccable hair), we love eating cup cakes..! <a href="http://themesart.com/christine/about-me/"> Read more..</a>

    This is the image we use:

    http://themesart.com/claire/wp-content/uploads/2015/03/aboutme1.jpg

  • Recent Posts Shows your latest posts from all categories or a specific category.
  • Facebook Widget Shows nice Facebook like box from your Facebook Page

  • These options are available:

    • Width and Height (Tip: 238x253).
    • Enable Dark Color Scheme.
    • Enable Faces.
    • Enable Stream.
    • Enable Header.

  • Social Icons This widget will display social media icons of your choosing. Just fill in the full URL's of the social networks you want to display.
  • Flickr Stream This widget will your latest Flickr Photo's. Just fill in your Flickr ID and use the options to customize your layout.
  • Video Widget This widget will a show video in your sidebar. Just fill in the video ID and and select Youtube or Vimeo. For a Youtube video: https://www.youtube.com/watch?v=5o5xw9-EvTg, the ID would be: 5o5xw9-EvTg and for a Vimeo video: https://vimeo.com/103012270, the ID would be: 103012270
  • Instagram Slider Ensure the Instagram Slider plugin is activated. This will display your latest Instagram images.

    Below you can see our Instagram Slider setup:

Featured Slider

To create the featured slider like our demo website, navigate to Appearance → Customize. On this page you will see our Live Customizer! On the left side of the screen, click on Settings: Slider.



This is how our setup looks like! Click SAVE and your slider is finished!

05. Posts and Post Formats

To create a new post navigate to Posts → Add New.

Post Settings and Layout

You can edit the look of your post by going to Appearance > Customize > Settings: Post and Page and hide/show different elements on the post and page.

You can also select a Post Layout in the post editor screen. (Top right, Full-Width or Sidebar)

Post Formats

Helen Supports 3 post types; Standard, Gallery and Video. You can switch between these formats in the post editor. A standard post format will look like a usual WordPress post. A Gallery format will show a slider with your selected images on the home and post page, you can add these images to the slider with a simple click interface. A Video format will show a video instead of an image. Just paste the url of a Youtube or Vimeo video into the box below: "VIDEO URL (OEMBED) OR EMBED CODE".

06. Pages

You can go to Appearance → Customize → Settings: Post and Page and hide/show share buttons or the post category.

To create a Contact page, we use the plugin "Contact Form 7" and we have made it easy for you to use this plugin.

After you imported the demo content you can check out a demo on the premade contact page.

07. Post Thumbnails

Christine uses the WordPress Post Thumbnails function. These are the images for your posts/pages and are shown on different positions in different sizes. WordPress will automatically resize your images to all of these various sizes used. You should always use images for posts with at least 1080px width to funtion correctly on your website.

To set a post thumbnail for your post, go to Posts > Add New > Set Featured Image
The normal upload box will now appear. Upload your image and click "Use as featured image". Now simply close the box.

08. Theme Options

Theme Option Panel

To open the theme customizer, go to Appearance > Customize. Here you'll be able to style your design, hide/show elements, upload your logo etc. The customizer has the following sections:

  • Navigation
  • Logo and Favicon
  • Home Page Layout
  • Settings: Top-bar
  • Settings: Header
  • Settings: Slider
  • Settings: Archive Layout
  • Settings: Footer
  • Social Profiles
  • Styling: Top Menu
  • Styling: Middle Menu
  • Styling: Content
  • Styling: Footer
  • Styling: Main Color
  • Styling: Custom CSS

Each section features options so that you can easily customize the theme to your needs!

Note: In order to make the Social Icons appear, please fill in the required information within the customize menu. Leave the information blank if you do not want to show a particular icon. Go to: Appearance → Customize → Social Profiles

09. Customize

There are two ways to customize the theme without changing it's core files.

It's important not to touch the theme core files because every time we will update the theme, you will lose you changes.

1. Theme Options Panel Custom CSS box

To style the theme with custom CSS, navigate to Appearance → Customize and click on the "Styling: Custom CSS" tab. This is where you can write your own CSS code.

2. Child Theme

The theme comes with it's Child Theme. If you want more complex customization of the parent theme and change the files, layout, html, objects order this way is even better. To start using child follow this steps:
  1. Navigate to Appearance → Themes
  2. Click the second tab "Install Themes" at the top and click the "Upload" link
  3. Now locate the christine-child.zip inside the "Theme Files" folder which you have downloaded after your purchase and double click on that file.
  4. Click the "Install Now" button and after the theme is installed Activate it
That is it, now the child theme is ready. You can open the style.css file and write your CSS there. It will override the default the CSS from the parent theme. You can also copy any file from the parent theme, put it inside the child them and make the changes.

10. Credits

We have used the following open source projects or other files as listed.

We have used the following images for our demo site

Enjoy using Christine. © 2015 Themes Art - WordPress Themes