Slippry Slider: Change Position of Slide Content

If you use a theme with Slippry Slider (currently it’s added into our ZenLifePro premium theme), you have probably noticed that Slide content is displayed at bottom position of the Slider.

In some case, you may want to display that content above or even at the top of the slider. Here is a guide how to change the content position:

  1. Login to your WordPress Admin Panel
  2. Navigate to Left Menu -> Appearance -> Customize
  3. Open ‘Additional CSS’ section
  4. Insert the following code there:
    @media screen and (min-width: 600px) {
    .sy-caption-wrap {
    bottom: 400px;
    }
    }Note: you can change the above value (marked in bold) to any other value i.e. ‘300px’ or ‘200px’ depending on preferred slide content position
  5. Save changes

How to Create a Child Theme

A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme.

Reference: https://codex.wordpress.org/Child_Themes

In some case you may need to create a child theme for our themes. Here are all of the necessary steps:

The good news is that our themes follow the official WordPress code guidelines. So, you can easily create a child theme, here are all of the necessary steps:

1. create a new folder for your child theme

2. add style.css file into your child theme folder. Here’s an example content for the file:

/*
Theme Name: tArt Child
Theme URI: https://tishonator.com/product/tart
Description: tArt Theme
Author: Tihomir Ivanov
Author URI: https://tishonator.com
Template: tart
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: tishonator
*/

3. Add functions.php file into your child theme folder. Here’s an example content for the file:

<?php
add_action( ‘wp_enqueue_scripts’, ‘tartchild_enqueue_styles’ );
function tartchild_enqueue_styles() {
wp_enqueue_style( ‘parent-style’, get_template_directory_uri() . ‘/style.css’ );

}
?>

The above function load the parent (the original) theme stylesheets

4. Login to Admin Panel and navigate to Left Menu -> Appearance -> Themes, then activate your newly created Child theme.

5. After activating the theme, the slider images will have to be re-configured. Navigate to Admin Panel -> Left Menu -> Appearance -> Customize -> Slider Section. Then set images for Slides.

Remove Mobile (Burger) Menu

remove-mobile-menu

In case you use a plugin for mobile (burger) menu such as WP Mobile Menu, you may want to hide/remove the theme default menu under mobile/tablet portrait screens (screenshot above). Here are all of the necessary steps how it can be done:

  1. Login to Your Admin Panel
  2. Navigate to Left Menu -> Appearance -> Customize -> ‘Additional CSS’ Section
  3. Insert the following code there:
    @media screen and (max-width: 799px) {#navmain {display:none;}
    }

    Note: The above code will hide menu for screens with width less than 799px. You may change it to other value if you prefer (the value marked in bold above).

  4. Save changes

How to Change Title Font Size of Recent Posts Slider Widget Items

recent-posts-slider-widget

The Recent Posts Slider Widget (screenshot above) is included in all our Premium themes. It allows you to insert a slider with recent posts of your website. You can easily use it, just login to your Admin Panel, navigate to Left Menu -> Appearance -> Widgets -> then add ‘Recent Posts Slider Widget’ into some of the Widget areas such as Homepage Above Columns, Homepage Column #1, Homepage Below Columns, Sidebar Widget Area, etc:

 

recent-posts-slider-widget-admin

By the default title of the items is same as blog titles from index page. In case you need to change the widget items titles, it will require a small code change, here are all of the necessary steps:

  1. Login to your Admin Panel
  2. Navigate to Left Menu -> Appearance -> Customize -> Additional CSS
  3. Insert the following code there:.jcarousel-item h1.entry-title {
    font-size: 16px;
    }

    Please Note: You can change the font size value above (marked in bold) with other value.

  4. Save changes

Alternatively, you can insert the above code into style.css (Navigate to Admin Panel -> Left Menu -> Appearance -> Editor, open style.css scroll down and insert the code).

How to Remove Header Search Icon

In some cases you may want to remove the header menu search icon. It will require a small code change. Here are all of the necessary steps:

 

1. Navigate to Admin Panel -> Left Menu -> Appearance -> Editor

2. Open yourtheme/inc/utilities.php

3. Find and DELETE the following code:

$result .= ‘<li><a class=”search-form-icon” href=”#” title=”‘.__(‘Search’, ’tishonator’).’”></a><div id=”search-popup-content”>’;

ob_start();
get_search_form();
$result .= ob_get_clean();

$result .= ‘</div></li>’;

4. Save Changes

How to Change Theme Text Direction From Right to Left

By default text direction in our themes is Left to Right. However, if your website is written in Hebrew or Arabic text, then you probably will have to change text direction to Right to Left.

It will require a small code change. Here are all of the necessary steps:

1. Login to your WordPress Admin Panel

2. Navigate to Left Menu -> Appearance -> Editor

3. Open header.php

4. Replace:

<body <?php body_class(); ?>>

with:

<body <?php body_class(); ?> dir=”rtl”>

5. Save changes

3 New WordPress Themes Released

We’ve just released 3 new Premium WordPress Themes: ZenFirePro, ZenSkyPro, and ZenWindPro.

So far, we do not plan to release new premium themes. Instead of it, we will focus to improve the current 5 Zen themes more and more 🙂