Documentation
Coffee Shop Pro
Thank you so much for purchasing our item from themes corner.
If you have any questions that are beyond the scope of this help file, Please feel free to email via Item Support Page.
Installation
Follow the steps below to setup your site template:
- Unzip the downloaded package and open the /HTML folder to find all the template files. You will need to upload these files to your hosting web server using FTP or localhost in order to use it on your website.
- Below is the folder structure and needs to be uploaded to your website or localhost root directory:
Installation By WordPress Admin area
- First you have to log into your WordPress admin
- Hit Add new theme and click upload
- Go to Dashboard -> Appearance -> Themes
- Click on Add New Theme button at top
- Click Upload Theme button and upload
- Hit on Activate once upload has finished
Installation By FTP
- Download coffee-shop-pro.zip file from your My Account.
- Extract Zip file
- By using your FTP, upload the non-zipped theme folder into the "/wp-content/themes/" folder on your server
- Go to Dashboard -> Appearance -> Themes and find out coffee-shop-pro theme from list
- Hit on Activate to active coffee-shop-pro theme.
General Setting
Go to Appearence -> Customizer -> General Setting
Documentation and examples for header, navbar, sidebar, footer
Header
The list of various header settings & its descriptions are provided below for your reference:
All Setting
There are two tabs here. General and style
You may follow below functionality.
- Show/hide Sticky Header
- Select Header Style
- Set Section Width
- Show/hide Header Button
- Add Header Button Text
- Add Header Button Link
- Change header colors
Logo Setting
There are two tabs here. General and Layout
You may change header site details by using below functionality.
- Select Logo
- Add Site Title
- Add Tagline
- Hide/Show Site Title
- Hide/Show Tagline
- Set Width
- Set Height
- Add Padding
Pages
The list of various pages settings & its descriptions are provided below for your reference:
Inner Pages
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Page Featured Image
- Show/Hide Page Title
- Add Sidebar Bullet Icon
- Select BG Image Height
- Select Left / Right and No Sidebar
- Select Page Width
- Set Image Opacity
- Select Header Box Transition Effects
- Select Colors
Blog Pages
There are Three tabs here. General, Layout and style
- Show/Hide Show Thumbnail Image
- Show/Hide Author
- Show/Hide Date
- Show/Hide Comments
- Show/Hide Excerpt
- Select Left / Right and No Sidebar
- Set Excerpt Length
- Select Width
- Select Colors
Single Post
There are two tabs here. General, Style
- Select Post Sidebar
- Show/Hide Author
- Show/Hide Date
- Show/Hide Time
- Show/Hide Category
- Show/Hide Comments
- Show/Hide Tag
- Hide/Show Socials
- Select Colors
Contact Page
There are two tabs here. General, Style
- Add Contact Heading
- Add Address, Email and Phone Number
- Set Left Image
- Add Form Box Title
- Add Form Shortcode
- Add Embed Code for map
- Select Title Case
- Select Box Onload Transition Effects
- Select Colors
Shop Page
There are two tabs here. General, Style
- Select Shop Sidebar Display
- Add Product Font Size
- Select Colors
Testimonials Page
There are two tabs here. General, Style
- Hide/Show Thumbnail Image
- Hide/Show Excerpt
- Select Colors
Team Page
There are two tabs here. General, Style
- SetFeature Image Height
- SetSocials Using On/Off
- Select Colors
FAQ Page
There are two tabs here. General, Style
- Set Right Image
- Select Colors
Gallery Page
There are two tabs here. General, Style
- Select Gallery Image Height
- Select Colors
Services Page
There are two tabs here. General, Style
- Set Button Display
- Add Button Text
- Select Colors
Other Settings
The list of various pages settings & its descriptions are provided below for your reference:
All Setting
- Show/Hide Back to Top Button
- Select Back to Top Icon Color
Font Setting
There are Seven tabs here. H1, H2, H3, H4, H5, H6, Body Font
Home Section
Go to Appearence -> Customizer -> Home Section
The list of various Section settings & its descriptions are provided below for your reference:
Slider
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Title and description on Slider
- Set Slider Animated BG Images
- Select Box Onload Transition Effects
- Set Animated Leafs Opacity
- Select Colors
- Select Section Width
- Set Section Padding
About Us Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Set Section Top Shape Display
- Set Left Image
- Set Animation On Image Display
- Set Image Shapes Display
- Add Text On Image
- SetSection Bottom Image
- Add Section Heading & Content
- Show/Hide Button
- Add Button Text
- Add Button Link
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Box Onload Transition Effects
- Select Section Heading Case
- Select Text On Image Case
- Select Colors
- Add Section Padding
- Select Section Width
Services Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
Go to Dashboard -> Services -> Add New -> Add Title, Content, Feature image
- Select Number of Services to Show
- Select Select Services from dropdown one by one
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Box Onload Transition Effects
- Set Services Title Case
- Select Colors
- Add Section Padding
- Select Section Width
- Set Excerpt Length
Banner Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Add Section Tagline
- Add Section Heading
- Set Section Sub Tagline
- Add Phone Label & Number
- Set Button Display, Button Text & Link
- Add Section Right Image
- Set Section Animated BG Image
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Button Onload Transition Effects
- Set Section Content Alignment
- Set Section Tagline Case
- Set Section Heading Case
- Set Section Sub Tagline Case
- Select Colors
- Add Section Padding
- Select Section Width
Features Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
Go to Dashboard -> Appearance -> Customize -> Features Section
- Set Number of Features to Show
- Set FontAwesome Icon
- Add Title, Content, Set Link
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Box Onload Transition Effects
- Select Section Heading Alignment
- Select Section Heading Case
- Select Features Title Case
- Select Colors
- Add Section Padding
- Select Section Width
Team Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
Go to Dashboard -> Team -> Add New -> Add Title, Content, Designation, Socials, Feature image
- Select Number of Team to Show
- Select Select A Team
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Section Onload Transition Effects
- Select Team Title Case
- Select Section Heading Alignment
- Select Colors
- Add Section Padding
- Select Section Width
Gallery Section
There are Three tabs here. General , Layout and Style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
- Select Number of Gallery Image to Show
- Select Select A Gallery Image
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Set Section Heading Alignment
- Set Gallery Title Case
- Select Box Onload Transition Effects
- Select Colors
- Add Section Padding
- Select Section Width
Testimonials Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
Go to Dashboard -> Testimonials -> Add New -> Add Title, Content, Designation, Feature image
- Select Number of Client to Show
- Select Select A Client Testimonials
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Section Onload Transition Effects
- Select Testimonial Title Case
- Select Testimonial Heading Case
- Select Section Heading Alignment
- Select Colors
- Add Section Padding
- Select Section Width
Contact Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Form Heading
- Add Form Shortcode
- SetLeft Image
- Set Bottom Image
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Set Section Heading Alignment
- Set Blog Heading Case
- Select Section Onload Transition Effects
- Select Colors
- Add Section Padding
- Select Section Width
- Set Excerpt Length
Blog Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
Go to Dashboard -> Post -> Add New -> Add Title, Content, Category, Tag, Feature image
- Select Number of Posts to Show
- Check Exclude Category from Blog Posts
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Section Onload Transition Effects
- Select Section Heading Alignment
- Select Colors
- Set Image Height
- Set Excerpt Length
- Add Section Padding
- Select Section Width
Newsletter Section
There are Three tabs here. General , Layout and style
You may follow below functionality.
- Show/Hide Disable Section
- Add Section Heading
- Add Form Shortcode
- Select Section Background Color
- Select Section Background Image
- Set Background Opacity
- Select Box Onload Transition Effects
- Select Section Heading Alignment
- Select Colors
- Add Section Padding
- Select Section Width
- Set Image Height
General Configuration
Go to Appearence -> Customizer -> General Configuration
The list of various settings & its descriptions are provided below for your reference:
Static Front Page
Background Image Setting
Header Image Setting
Colors Setting
Font Setting
Section Sequence
Go to Appearence -> Customizer -> Section Sequence
Inter change section Sequence name.