Theme Documentation

Created: June 2020
Email: stuff@giacomo.com.ua

Thank you for purchasing Sharlene Blog theme and supporting our work. If you have any questions that are beyond the scope of this documentation, please contact us by stuff@giacomo.com.ua or via contact form on our profile page. We will try respond within 24hour.

Sincerely, GiaThemes

Installation

After purchasing the theme and downloading the zip file make sure you upload ONLY the theme files sharlene.zip.
You can complete installation in two different ways:

  • INSTALL VIA WORDPRESS:
    • Log into your WordPress dashboard and navigate to Appearance > Themes.
    • Click the "Add New" button at the top-left of the page > Click the "Upload Theme" button at the top.
    • Click "Choose File" > find your zipped "sharlene.zip" package > Click the "Install Now" button.

    Once the theme is successfully installed on your WordPress, you can "Activate" it via the installation page or via Appearance > Themes to begin using your Sharlene theme!

    NOTE: If you try installing the entire downloaded package or another incorrect file, you'll likely receive this error message:

    "The package could not be installed. The theme is missing the style.css stylesheet. Theme install failed."

    If you receive this error message, please be sure that you're installing the ZIPPED file titled "sharlene.zip".



  • CHILD THEME INSTALLATION:
  • After installed parent sharlene.zip theme, you also can install Sharlene Child theme. Child Theme borrow all features and appearance of their parent theme and can change them without touching the code of parent theme. Child allows you to save all the settings (from theme customizer) or changed theme’s files after parent theme update/reinstall.

    • Navigate to Appearance > Themes.
    • Click the "Add New" button at the top-left of the page > Click the "Upload Theme" button at the top.
    • Click "Choose File" > find your zipped "sharlene-child.zip" file > Click the "Install Now" button.

    After installing both parent and child themes, you can go ahead and activate the child theme.

  • FTP INSTALLATION:
    • In main downloaded archive find the file sharlene.zip, then unzip it.
    • Upload unzipped theme (sharlene) folder to to your FTP > WordPress site root > wp-content > themes folder.
    • Activate the newly installed theme by going to WordPress Appearance > Themes and clicking the Activate button.

Recommended plugins

Once you activate "Sharlene" theme you will see a notification message - to install and activate the required & recommended plugins.

Plugins Install & Activation:

  • Click "Begin Installing Plugins" button:
  • Then, check "Plugin" checkbox (in order to select all plugins), choose "Install" options and click "Apply" button. Be patient, it will take some time.
  • After install plugins click "Return to Required Plugins Installer" button.
  • Activate plugins by clicking on "Plugin" checkbox, choose "Activate" options and click "Apply" button.

Required & Recommended plugins list:

  • Sharlene Social Share - to display social share icons
  • Sharlene Custom Widgets - to display theme custom widgets
  • Sharlene Post Likes and Views - to display post likes and views
  • MailChimp for WordPress - displays subscribe form
  • One Click Demo Import - to import demo content
  • WooCommerce - to create your shop page
  • Contact Form 7 - to display contact forms
  • Instagram Feed - to display your latest Instagram photos

Demo Content

Importing a demo to your site is optional for using Sharlene theme. It is for easy start - when you have a fresh WordPress installation, you can import some dummy content and predesigned layouts & styles to your site, then you can replace with your own content, and tweak some layouts and colors.

NOTE: Make sure all recommended plugins are installed and activated before beginning the import in order to capture all settings

  • ONE CLICK DEMO INSTALL:
  • After installing Sharlene required/recommended plugins, refresh the page, you will see Import Demo Data under Appearance tab in the left sidebar. Click it.

    Click Import Demo Data button and wait until import process will be finished.

Recommended PHP settings:
- memory_limit = 64M
- max_execution_time = 6000
- upload_max_filesize = 64M
- max_input_time = 6000
- post_max_size = 6000
- suhosin.post.max_vars = 5000
- suhosin.request.max_vars = 5000
- max_input_vars = 5000
- max_input_time = 60

  • MANUALLY DEMO INSTALL:
  • The main downloaded theme arhive includes a file named demo-content.zip. Before uploading the demo files, unzip it.

    • Go to Tools > Import to begin the import process.
    • Click on the WordPress option in the list
    • If this plugin didn’t installed yet - in the popup window click Install Now. After installed successfully, click Activate Plugin and Run Importer
    • Select sharlene.xml file (in unzipped demo-content folder) and run the import process.
    • Check "Import Attachment" checkbox and click Submit button. Wait until the importing process is finished.

    Widgets Demo data install:

    • Go to Plugins tab. Click "Add New" button and search Widget Importer & Exporter plugin. Install and activate the plugin.
    • Go to Tools > Widget Importer & Exporter option.
    • Click Choose File button and then select sharlene-widgets.wie file (in unzipped demo-content folder).
    • Note: After import you may see that some widgets did not import whole. To fix this, go to Appearance > Widgets and click "Save" widgets buttons.

    Customizer Data install:

    • Go to Plugins tab. Click "Add New" button and search Customizer Export/Import plugin. Install and activate the plugin.
    • Go to Appearance > Customize > Export/Import tab (in the end of sections list).
    • Click Choose File button and then select sharlene-export.dat file (in unzipped demo-content folder). Save the changes.

Regenerate Images

If you install Sharlene theme on a website that already has uploaded images, you can use Force Regenerate Thumbnails plugin to delete all old images size and regenerate the thumbnails for image attachments by custom Sharlene Theme size.

To regenerate images, follow this steps:

  • Go to Plugins and click Add new button
  • Type Force Regenerate Thumbnails in search field and install the plugin
  • Go to Tools → Force Regenerate Thumbnails
  • Click on Regenerate All Thumbnails and wait until it is finished

IMAGES: In Sharlene demo we mostly used images width 1280x760px dimension.

Theme Options

To access the Theme Options, navigate to Appearance > Customize tab.

Theme Options have the following sections:

  • General - to upload your logo and favicon. Enable/disable top panel icons.
  • Advertisement - to upload/remove advertisement images before/after blog posts
  • Header Image - to upload header image (will display after homepage slider)
  • Background Image - to upload body background image
  • Menu - choose your top main menu
  • Colors & Backgrounds - theme text and background colors (main color, link color, text coloe, ect.)
  • Typography - select the Fonts for body and headings
  • Sliders and Promo Box - setup header slider layout, disable/enable and setup promo box block
  • Blog Options - customize blog layout, set post Excerpt Length, disable/enable Read More button
  • Post Options - disable/enable single post elements (category, tags, date, post navigation, author block ect.)
  • Footer Setting - choose footer layouts (1,2,3,4 columns), copyright text
  • Social Media - disable/enable the social icons
  • WooCommerce Options - customize shop page layout, enable/disable product elements
  • Custom CSS - paste your CSS code to theme

Posts Setup

To setting up your Posts, navigate to Appearance > Customize > Post Options tab. In this section you can disable/enable the meta details (such as date, category, social icon, ect.) and other post blocks.

To display Author Box after post content - add information about yourself in Users > Your Username > About Yourself > Biographical Info field:

To display Signature Image after post content - naviage to Appearance > Customize > Post Options tab, enable "Display Signature Image?" option and upload your signature image:

To display Social Share Buttons, make sure you've installed Sharlene Social Shareplugin.

To display postLikes and Views, make sure you've installed Sharlene Post Likes and Viewsplugin.

The Related Posts (You May Also Like) block displays related posts by tags.

Pages Setup

Sharlene theme includes three page templates to choose from:

  • Default - using this page template will output a default page without sidebar (full width page).
  • Left Sidebar - using this page template will output a page with left sidebar.
  • Right Sidebar - using this page template will output a page with right sidebar.

You can set your page template from the Template dropdown list in Page Attributes box.

In Classic Editor:

.

In Gutenberg Editor:

.

Contact Page
You can create a contact page with using recommended "Contact Form 7" plugin:

  • If you didn’t install this plugin before go to Appearance > Install Plugins.
  • Hover over "Contact Form 7", install and activate plugin.
  • Go to Contact Form tab in right dashboard sidebar.
  • You can create a new form or edit a default contact form.
  • After form setup copy shortcode of this form.
  • Add/Create a new page and paste the shortcode into the text editor.

Widgets Setup

WordPress Widgets allows to add featured widget blocks to your Sidebars. Navigate to the Appearance > Widgets tab to access the list of widgets and widget sections that they can be added to.

"Sharlene" theme comes with 7 custom widgets:

  • Sharlene: About Me - this widget allows you to add your image and a short description about you with your signature image.
  • Sharlene: Promo Post - a widget that displays your promo post.
  • Sharlene: Social Icons - a widget that displays your social icons.
  • Sharlene: Recent Posts from Category - displays recent posts from custom category.
  • Sharlene: Recent Posts List - displays your latest posts.
  • Sharlene: Images Links Block - displays the images with link title.
  • Sharlene: Advertisement - allow to add advertisement image with URL to sidebar.

NOTE: "Sharlene" theme contains the following widget areas:

  • Blog Sidebar - displays widgets on blog/post page
  • Subscribe Widget - an area before main blog post content for subscription form
  • Instagram Widget - footer widget area for instagram images feed
  • WooCommerce - displays widgets on woocommerce page
  • Footer Widgets Area - displays widgets in footer area (1,2,3 or 4 columns)

MailChimp Form

To add Subscribe box, go to MailChimp for WP tab > Forms in WP Admin and create new subscribe box. Copy the following code and paste to "Form code" field:


<div class="row">
	<div class="col-md-3">     
			<h2> JOIN US TODAY!</h2>
			<p>
			<span>Receive the latest posts via email</span>
		</p>
	</div>
	<div class="col-md-9 no-padding">
		<div class="col-md-4">
			<input type="text" name="NAME" placeholder="Your name" required />
		</div>
		<div class="col-md-4">
			<input type="email" name="EMAIL" placeholder="Your email address" required />
		</div>
		<div class="col-md-4">  
			<p>
				<input type="submit" value="Subscribe">
			</p>
		</div>
	</div>
</div>
	

Then, navigate to Appearance > Widgets and drag "MailChimp Sign-Up Form" widget to "Subsribe Widget" area.

To add form in footer, drag "MailChimp Sign-Up Form" widget to "Footer Widget 1" area.

You can find more on plugin page https://wordpress.org/plugins/mailchimp-for-wp/

Instagram Feed

To add instagram on your blog, make sure you've installed "Instagram Feed" recommended plugin. Then, navigate to "Instagram Feed" tab and click "Connect an Instagram Account" button.

To change the feed layout, navigate to Customize plugin tab and choose the number of images to display.

To display your instagram feed in footer, navigate to Appearance > Widgets , and drag Text Widget to "Instagram Widget" Area and paste [instagram-feed] shortcode in this widget text field.

WooCommerce

  • WOOCOMMERCE WIZARD SETUP:
  • If you haven't installed WooCommerce on your WordPress before, you will be greeted with a screen asking you if you'd like to run the WooCommerce Setup Wizard.

    Click "Let's Go!" to get started. The Setup Wizard will explain that it will automatically create a number of shop-related pages for you, including pages for the "Shop", "Cart", "Checkout", and "My Account". Click "Continue" to have WooCommerce create these pages for you.

  • WOOCOMMERCE MANUALLY SETUP:
  • If you missed WooCommerce Wizard, you can create and setup woocommerce pages manually:

    To set WooCommerce Shop Products page go to WooCommerce > Settings > Products tab and choose your Shop page.

    To set WooCommerce Cart and Checkout pages go to WooCommerce > Advanced tab.

    To customize shop page navigate to Appearance > Customize > WooCommerce Options tab:

    Information about adding a new product will be found at on http://docs.woothemes.com/document/managing-products/
    To locate the full listing of WooCommerce plugin shortcodes go to http://docs.woocommerce.com/document/woocommerce-shortcodes/

Translation

"Sharlene" allows you to translate the theme into any language. You can translate the theme in two easy ways:

1. Using Loco Translate WordPress plugin: https://wordpress.org/plugins/loco-translate/

Here is a link to plugin Beginner's guide: https://localise.biz/wordpress/plugin/beginners

2. Using POEdit translation editor:

  • Download and install POEdit translation editor (https://poedit.net/).
  • Open Poedit and go to File > New catalog from POT file and select the POT in your theme’s languages folder.
  • A catalog properties box will pop up asking for information about what you are translating. Enter the language you want to translate
  • After you hit “OK,” you’ll be asked what you want to name your translation file. For example, German would be de_DE.po. See language code list here. http://codex.wordpress.org/WordPress_in_Your_Language.
  • Translate all the strings in the list and save changes. After you save, you will have two files (i.e. de_DE.po and de_DE.mo)
  • Upload these files to sharlene/languages/
  • For WordPress 4.0 and above, go to Settings > General and select Site Language. For WordPress 3.9.2 and below, open your wp_config.php file in the root, and find this line: define('WPLANG', ''); Change it into your language code. For example, define('WPLANG', 'de_DE')

If you want to learn more about how to translat WordPress into your language please visit: http://codex.wordpress.org/Translating_WordPress

Support

All support is handled via a contact form on our profile page or email stuff@giacomo.com.ua. We will try replay within 24 hour.
Thanks, GiaThemes