Appearance ▸ Customize
Last updated
Was this helpful?
Last updated
Was this helpful?
Navigate to Appearance ▸ Customize. Here you can configure various theme settings from design to copyrights text. It's recommended to add at least a few pages and posts before you start customizing website's look.
You can quickly change site title and tagline and upload logotype image. It's better to upload all logo images to avoid bad readability on HiDPI screens and over the light/dark hero images.
It must be 2x larger than "Logo" image.
It must be light in most cases, or make sure that it looks good over dark hero images.
It's strongly recommended to prepare properly resized png/jpeg/gif files before uploading, because the theme doesn't provide any options to change logotype dimensions. There are many technical and aestetical reasons for that: a pixel perfect graphic in terms of the design, for example.
Select between "Fullscreen" and "Inline" types. "Fullscreen" menu activates on the website by clicking menu link ("hamburger" icon, for example, which style you can change in the "Menu link style" setting below). "Inline" menu represents a regular website menu that appears on the right to logo position.
There are 3 options available: "Left", "Center" and "Right". You can select an alignment, you prefer.
This option is only available when menu type has been set as "Fullscreen". Change the font size of the menu items.
Again, this option is for the "Fullscreen" menu only. Decide whether the menu rests in a row or enable column layout.
Activates a solid menu background when user scrolls down the page. It doesn't appear until hero image/slideshow/video is visible in the browser viewport.
Enable or disable full width menu layout.
This option is only useful, if you assigned a menu to "Header Compact Navigation" location. It remains visible on smartphones when it's enabled. Otherwise, it will be moved to the mobile menu.
Enable or disable short navigation that replaces the logo on single posts and archive pages. Make sure that Settings ▸ Reading ▸ Portfolio settings ▸ Portfolio page is assigned, if you can't see the parent link on single portfolio posts.
Change menu link style. "Inline" menu link appears only when menu is hidden (i.e. when user scrolls down the page).
Set an indent between site's header and the content. Default value is 75px.
Set an indent between site's content area and footer. Default value is 120px.
Modify the hero header height.
"Cover" mode forces the image (or video) to fill the full height and width of the hero header, but often crops them in the process. "Contain" increases or decreases the size of the image (or video) to fill the hero header width/height, preserving aspect-ratio. * Changing this setting may not take effect on the current page, if it was overrided in the "Hero header" tab of the individual page settings.
Select "Eye" or "Arrow" navigation. You can check the result on any page that has hero slideshow.
It's a global alignment option for the "Page description" field, you can see while editing pages. Can be overrided in the individual page settings.
Hero title font size (excluding "Page description"). It refers to single portfolio post title and any title in the slideshow on pages, if page description was not added.
A global option that applies to titles in the slideshow and all titles on the website. Can be overrided in the individual page settings such as "Title alignment" and "Alignment" in the slide settings.
Manage portfolio settings in this section. Preview your changes on the page that utilizes "Portfolio" template.
Select gaps between portfolio posts thumbnails.
"Flex" mode provides a regular CSS Flexbox grid. You are able to control items alignment, using 2 settings below: "Vertical alignment" and "Horizontal alignment".
There are 4 different styles, available for selection: "Default", "Minimal", "Ticker" and "Overlay".
Title font size that's below or over the post thumbnail (depends on the "Hover effect" option).
Categories filter type. "Fixed" filter is hidden and can be activated by clicking "Filter" link that appears on the left of the portfolio page. "Static" filter locates above the portfolio grid.
These settings apply to posts page that's selected on the Settings ▸ Reading screen. Open the page in the Customize preview window to track changes.
Select "Plain" or "Grid" type.
Select one of the available font size options.
Show/hide post excerpt.
3 Type are available for selection: "Plain", "Minimal" and "Modern". Preview changes on the page that has pagination such as blog or portfolio page (if these have enough posts).
Pagination alignment.
Select a font for all heading on the website.
Another font that's used for all texts on the website.
It does apply to <blockquote>
tag and some other elements on the website.
You can change the font weight for any font option. Font subsets selection is only available for Google Fonts.
Global color options for all pages.
Page background.
Text color. Please pick a contrast color for better readability on pages.
Links and a few other desing elements color.
You can counfigure social profile links here.
Select link style. Display as a plain text links or as icons.
Add social profile URLs below. Leave fields blank to hide a link.
This subsection allows you to configure sharing icons/links.
Select link style. Display as a plain text links or as icons.
Enable or disable sharing bar links below.
This image will be used as default placeholder in Open Graph meta tags if featured image isn't available.
You need to update social networks cache every time you change default sharing placeholder. Here is the nice article, where you can learn more about Open Graph Meta Tags and how to rescan your website by social network debug tools. Note, it isn't a theme support area.
Your Twitter username will be used for Twitter Card Meta Tags.
Add Google Maps API key in the "Google Maps" subsection. It's required in order to enable javascript API for the map on the page that uses "Split" page template with map activated.
Add site copyrights text in the "Copyrights" subsection. It appears in the site's footer. Allowed HTML tags: <a>
, <br>
, <span>
, <strong>
and <img>
.
It's native WordPress feature, so you can read about it in WordPress Codex article.
But, it must be noted that Wakiro theme also supports menu item descriptions, if navigation menu type was set as "Fullscreen". Read how to add descriptions here (step #1 only), please.
The theme has 3 menu locations: "Primary Navigation", "Compact Header Navigation" and "Footer Navigation".
Primary location can be found in the site's header or in the full screen overlay, if your menu type is "Fullscreen".
"Compact Header Navigation" is completely optional and it's mainly for the "Fullscreen" menu type as well. You are able to add a small inline menu in addition to the primary navigation. See on the screenshot, please:
"Footer Navigation" locates in the site's footer. It's better to don't add many items to ensure that it looks good in a couple with copyrights text. Of course, it depends on your preferences.
You can read about native "Widgets" section on WordPress Codex.
There are 2 built-in widget areas in the theme: "Sidebar widget area" and "Footer widget area". By default, footer widgets area isn't activated and sidebar is only available on the posts page (blog), including its archives, and single blog posts, but you can change that in the next "Sidebar and Footer" section.
In this section you can assign sidebar and footer to posts and pages, visining an apropriate subsection. There are 3 settings you need to configure in every subsection: "Sidebar label", "Sidebar" and "Footer". Sidebar is hidden on the website and can be opened by clicking "sidebar link":
Wakiro theme provides the ability to create custom widget areas that can be assigned to any posts and pages like 2 built-in default ones. Navigate to Widget areas and create as many, as you might need. See on the screenshot below:
Note that widget area isn't visible in the "Widgets" section while visiting a page which has no sidebar/footer in the Customize preview window. So, open a page that has it or just assign default or custom widget area in the "Sidebar and Footer" section. Then you will be able to add widgets via Customize ▸ Widgets screen.
You can see "Homepage settings", "Additional CSS" etc. sections on the screen. These settings are native, so you can find helpful articles on https://www.wp101.com/, for example.