Introduction
Thank you for purchase!
This is documentation for "Mindful - Psychotherapy FSE WordPress Theme". Documentation consists of sections. Every section explains specific part of theme or functionality. List of sections is in left side of screen.
- If you are new to WordPress, it is recommended to read official WordPress documentation first.
- Please read theme documentation and follow instructions for demo theme content setup.
- Use search (ctrl+f keyboard shortcut) to find words on page.
Demo theme content setup
Steps for demo theme content setup
1.Unzip main.zip file that you downloaded from Themeforest, find „mindful.zip“ and upload it to WordPress dashboard.
2.
In WordPress dashboard go to appearance/themes and activate theme „Mindful“.
3.
Install and activate all recommended and required theme’s plugins
4.
In dashboard, go to tools/import and import demo.xml file. Demo.xml file is in folder "demo-content" inside main zip file you downloaded from Themeforest.
Be sure to replace demo images with images you have license for or with free images.
5.
In settings/general there are few things like site title to be added and in settings/reading option to choose homepage and blog index page. Logo image should be uploaded in appearance/editor/patterns/header template.
Installation is finished. For more details and functionalities please see sections list in left side of screen and continue reading.
Editor
Mindful theme is built as 100% FSE (full site editing) theme for Block editor. All templates for theme pages are in appearance/editor.Official Block themes documentation In official WordPress documentation can be learned more about block themes in general.
About Site editor (official documentation)
Patterns and custom blocks
Theme has patterns that represent editable parts of design. They can consist of sections or boxes or only text lines that can be added to design and customized. Theme also has two custom block for video popup and blog list.
Navigation (menu)
Menu or navigation can be edited in appearance/editor/navigation.About site editor navigation (official documentation)
About navigation block (official documentation)
How to change colors and fonts
Colors can be changed in appearance/editor/styles/colors.
More Google font families can be added with option fonts/manage-fonts.
About styles (official documentation)
Pages and page templates
Theme has few custom page templates created and available in Editor. Templates can be changed for every page in "template/change template".
Appointment
Appointment function is created with the Booking Calendar plugin. Official plugin page Theme has custom class for appointment form "custom-mindful-calendar1" that will add styling to form.Popup anything
Popup function is created with the Popup anything plugin. Official plugin page Theme has custom class "custom-block-button1" that adds styling for button popup version of this plugin.Contact form
Everything related to contact is created with Contact form 7 plugin. Official plugin page. Contact forms are imported with demo content.1. This is code for "Contact form 1":
<div class="cf7-row">
<div class="cf7-col">
<label">Name</label">[text* your-name placeholder "Your Name (required)"]
</div>
<div class="cf7-col">
<label">Email</label">[email* your-email placeholder "Your Email Address (required)"]
</div">
</div">
<div class="cf7-row">
<div class="cf7-col">
<label">Program</label">[select select-189 "Program one" "Program two" "Program three"]
</div">
<div class="cf7-col">
<label">Date</label">[date date-176]
</div">
</div">
<div class="cf7-col"">
<label">Message</label">[textarea textarea-960 class:smalltextarea placeholder "Leave us message"][submit "Send"]
</div">
How to set permalinks
- Permalinks are in dashboard/settings/permalinks.- It is recommended to have this permalinks structure (see screenshot):
How to reset permalinks?
- Set permalinks to default (plain) and click button "save changes".
Custom classes
"custom-block-button1" and "custom-block-button1-hover" are custom classes that can be added for button block to add styling animation."sticky-header1" for header always on top when scrolling page.
"top-header1" for part of header above menu with widgets to be hidden on small screens.
"sticky-no-992" for sticky header to be hidden on tablet. (use with sticky-header1)
"sticky-no-767" for sticky header to be hidden on phone. (use with sticky-header1)
"counter-custom1" and "counter-custom2" for counter block styling
"custom-accordion1" for details (accordin) block styling
"listonenegative" for inactive list-one block in prices
All classes are already added in theme demo content.
Plugins
Rt Mindful FSE Theme Functions plugin - theme functions, blocks and custom post types plugin, bundled with theme.TGM plugin bundled with theme. http://tgmpluginactivation.com/
Booking calendar. https://wordpress.org/plugins/booking/
Carousel slider block https://wordpress.org/plugins/carousel-block/
Contact form 7 plugin. https://sr.wordpress.org/plugins/contact-form-7/
Breadcrumbs plugin. https://sr.wordpress.org/plugins/breadcrumb-navxt/
Counters block plugin. https://sr.wordpress.org/plugins/counters-block/
Theme translation
Theme has pot file included, that means text strings in dashboard can be translated. Activate translation plugin (can use Polylang). https://wordpress.org/plugins/polylang/ Check if "languages" tab in settings appears. In theme folder "languages" default pot file is included. To translate text strings in theme, please rename mindful.pot file to "language code" for language you want to translate in, for example if you translate to Portugales language code is "pt_BR" so mindful.pot should be renamed to "pt_BR.po". Then open the file with Poedit and translate text strings. http://poedit.net/ More details about WordPress translation here :http://codex.wordpress.org/WordPress_in_Your_Language http://codex.wordpress.org/Installing_WordPress_in_Your_LanguageHow to reorder posts
- Install and activate this plugin: https://wordpress.org/plugins/post-types-order/- It adds "reorder posts" button for all posts and custom post types and you can manually reorder them.
Sources and credits
TGM plugin activation https://github.com/thomasgriffin/TGM-Plugin-ActivationAll free plugin mentioned above from WordPress respository.
Bootstrap framework (customized, normalizer only), magnific-popup.js,
Google fonts,
jQuery.js
Images are not included for download. Images are slightly transformed to fit design. Images and icons credit: http://freepik.com