Testina is a delicious, responsive food blog WordPress theme.
Learn how you can get the most out of the theme with the Testina WordPress theme documentation.
Testina WordPress theme documentation, step 1: Theme installation
The theme can be installed through the WordPress Admin panel.
- Log in to the WordPress Admin panel.
- Go to Appearance -> Themes.
- Click the Add New button, at the top of the screen.
- In the Add Themes screen, click on Upload Theme.
- Click on the Choose theme, and then browse for theme file on your computer.
- Click on the Install Now to start the install process.
- After the installation is done, click on the Activate theme.
A detailed video for the theme installation is available here: https://help.themeskingdom.com/how-to-install-and-setup-the-theme.
After activating the theme, you will be prompted to install the required plugins. Required plugins in the Testina WordPress theme documentation are:
Jetpack
Jetpack is the world popular plugin that extends WordPress features. In the Testina theme, it is used to extend galleries’ features and protection. The official documentation is available here: https://help.themeskingdom.com/jetpack-plugin/
Kirki
Kirki is a plugin that enhances theme experience by adding useful elements in the customizer, like image position picker, font settings and such.
Testina WordPress theme documentation, step 2: Theme demo
To set the theme as presented in our demo, you can import the demo file.
Testina WordPress theme documentation, step 3: Theme setup
Testina is set to present a food blogger site. Posts are used for recipes and other entries.
To set up the theme, please follow the next steps:
- First, create several posts – set featured image for each post. Group posts in categories. Tag posts that you wish to display in the featured content slider with the same tag (e.g. “Featured”). You have probably noticed that the first slide in our demo is not clickable, with the highlighted second line. To get the same effect, you will need to create a post with the Quote post format, and to wrap the desired title word(s) in a span HTML element with the class “highlighted-text”. Refer to the image below to see how it looks in our editor.
- Create some pages – go to Pages -> Add New and create three new pages – About, Contact and Cookbook. All pages are using the Default page template. In the Contact page, you will need to insert a contact form from Jetpack. On the Cookbook page, testimonials are added using the blockquote element.
- Leave theme reading as is – the Testina theme is displaying the latest posts on the homepage.
- Creating primary and footer menu: Go to Appearance -> Menus. Create a new menu with title e.g. Primary. Add all your pages to it, and mark it as a Primary. Create another menu, but with the title Social. Add links to your social profiles as Custom Link items, and mark it as a Footer menu.
- Finally, you’ll probably like to add some personal touch to the theme. Go to Appearance -> Customize.
- In the Site Identity set your logo or add site title.
- Content Options: Set a blog to display excerpt, and leave other options turned on.
- Widgets: Add four widgets – Text, Navigation Menu, Recent Posts and Categories widgets to the sidebar. Into the Text widget, enter the short description of your site or your bio. For Navigation Menu widget choose your Footer Menu. Categories and Recent Posts are widgets that will display a list of your categories and posts.
- Featured Content: Enter tag(“Featured”) that you have used for your posts. Only posts tagged with the same tag will appear in the slider.
- Add the following classes to Additional CSS section to tweak some styles:
.site-title { font-weight: 100; } .emphasis { font-size: 50px; } .page .container.container-small { max-width: 980px; } blockquote { margin: 1em 0; } .emphasis { font-weight: 200; } h1, .last-post .entry-title { font-size: 60px; }
Testina WordPress theme documentation, step 4: The Customizer
The Customizer in the Testina WordPress theme documentation allows you to modify theme visuals and settings easily. Here are the customization options in the Testina theme:
-
<li
Site Identity
Site Identity panel is used for setting up basic site identity:
- Logo: Site logo is an image in .jpg, .jpeg or .png format. Suggested logo image size is 210 x 40px.
- Site Title: The name of your site. Ideal length should not exceed 20 characters. If the site title is longer, it will be displayed in two (or more) lines.
- Tagline: Tagline is a short description of the site, or simply a punchline of your business.
- Title and Tagline Visibility: If Display Site Title and Tagline is checked, both Site Title and Tagline will be displayed.
- Site Icon: Site icon will be displayed in a browser tab, bookmarks, or the WordPress mobile app. The icon should be squarely-shaped, and the recommended icon size is 512 x 512px.
Menus
The Customizer menu option allows the user to manage available menu locations, and add and remove menu items. Mosaico theme has two menu locations available – the Header menu, which is mostly used for the primary menu, and the Social menu. Menus can be managed from Appearance -> Menus as well.
Content Options
The Content Options panel in the Testina WordPress theme documentation allows you to control the visibility of posts metadata. By enabling or disabling the options, you can show or hide dates, categories, tags, and the author for all posts. You can also control how posts will appear on the posts page – with full content, or just as the excerpt.
Widgets
Widgets are useful extensions for content, which you can add to your sidebar or other widget areas. In the Widgets option in the Customizer, you can see available widgets area in the currently active theme.
Homepage Settings
Homepage settings work the same way Reading settings in Settings -> Reading does. Homepage settings allow you to set the theme to use static homepage, or to display the latest posts.
Featured Content
Featured Content in the Testina WordPress theme documentation can be used to set the tag that is used for the posts to display them as the slider on the homepage.
- Tag name: Enter the tag name that you have used for posts that you wish to appear on the homepage.
- Do not display the tag in post details and tag clouds: If enabled, the tag used for the slider will not be displayed anywhere.
- Also, display tagged posts outside the Featured Content area: If enabled, posts tagged with the tag used for the slider will be displayed on all post archives pages.
- Autoplay slider: If enabled, the slider will automatically play slides.
Setting up a slider
To set up the slider:
- Go to Settings -> Reading. Select the homepage to display Your latest posts.
- Go to Posts -> Add New. Create several posts. For each post enter a title, and set featured image. Tag desired posts with the same tag e.g. Featured. The Tag will be used to identify and display desired posts as a slider.
- Finally, go to Appearance -> Customize, and under Home Slider Options -> Slider – Featured Content enter the tag used for the posts.
Theme Settings
Theme Settings panel contains theme-specific settings. Available options are:
- General Theme Colors
- Footer Settings
- Font Settings
General Theme Colors
Theme colors are used to add a personal, artistic touch to the site. Lines color setting controls the color of lines on the homepage. The background color will define background color on the whole site, while other options are used for text color on the site.
Footer Settings
Footer Copyright Text: Text that will be displayed in the footer, as footer credits. You can enter basic HTML elements to create links and stylize footer text.
Font Settings
In the Font Settings panel in the Testina WordPress theme documentation, you can customize what font families will be used for the theme elements. If you need assistance on how to integrate additional variants, please submit a support ticket.
Additional CSS
Additional CSS section is used for custom CSS classes, without interfering with theme original CSS files, or creating a child theme. These classes are always loaded first, before other stylesheets. In the Useful CSS Classes section, you can find some most used classes.
Testina WordPress theme documentation, step 5: Useful CSS Classes
Creating a highlighted post
The highlighted post uses a span with class “highlighted-text” in the title. You can use this class in other elements to create highlighted text.
To change highlight color and text color, add this class to Additional CSS:
.highlighted-text { background-color: #f6d02e; color: #fff; }
Modify site title
.site-title a { font-size: 36px; font-weight: 700; }
Modify navigation font size
.main-navigation a { font-size: 14px; font-weight: 400; }
Hide Search icon
.search-button { display: none; }
Modify single post title size
.single .entry-title { font-size: 48px; }
Reduce spacing between title and the content on a single post
.single-post article .entry-header { padding-bottom: 60px; }