Zakra

1. 1. Go to Appearance > Themes in the WordPress Dashboard.
   2. Click on the Add New button.
   3. Click on the Upload link

1. Select the zakra.zip file
2. Click on the Install Now button

1. Go to Appearance > Menus in the WordPress Dashboard
2. Click on Create a new menu link
3. Give a name to your menu in Menu Name and click Create Menu button
4. Now, choose the pages, categories, custom links from the left side of your screen by selecting the checkbox and click on Add Menu
5. Under the Menu Settings, located at the bottom of your screen, select the Display location (i.e., Primary, Header Top or both ) option and click on Add Menu
6. Click Save Menu after adding the required pages, categories & custom links in the menu

Logo, Site Title, Tagline & Site Icon can be uploaded and changed to best suit your site.

1. Go to Appearance > Customize >Site Identity section
2. Now, upload the required Logo for your site
3. Insert the Title and Tagline as required on the site
4. Click on the Publish button to save the changes made on the site

It is shown in the image below:

To show site title & Tagline, set the Display Site Title and Tagline as checked and uncheck to hide.

1. Go to Appearance > Customize >Header Media section
2. Click on Add new image/ video to upload the required image/video for your header
3. Click on the Publish button to save the changes made on the site

Note: This feature can be utilized to get a transparent header above an image as shown below which can be done by enabling Transparent Header from Page Settings

1. Go to Appearance > Customize > Background Image section.
2. Now, choose the required background image for your site
3. After you have chosen the required background image for your site, you can click on the Publish button to save the changes made on the site.

Note: The effect of this change is visible only in Boxed layout which can be set from Appearance > Customize > Theme Options > General > Container Style

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Header > Header Top Bar section.
2. Switch on the Header Top Bar to show the header top bar options
3. From the Left Content options, select one among the Text/HTML, Menu and Widget
4. If you choose Text/HTML in Left content options, insert the content in the Text editor as below:
   
5. If you choose Menu in Left content options, select the menu from the available menus under Select a Menu for Left Content 
   
6. If you choose Widget in Left content options, you need to insert the widget by going to Appearance > Customize > Widgets > Header Top Bar Left sidebar/Header Top Bar Right sidebar and insert the widget of your choice as below:
   
7. Choose the color from the Header Top Text Color  for text and Background Color option or image from the Background Image option according to your need as below:                                                                                                                                          
8. After you have inserted the content, you can now click on the Publish button to save the changes on your site.

Header Background Image is changed and shown in the image below:

Note: Different settings for the Header Image is also available such as Background Repeat, Background Position, Background Size, and Background Attachment as shown in the above image.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Header > Header Main Area section.
2. Choose the Style from available options
3. Enable the Search icon to show it beside the menu
4. Slide the slider under the Border Bottom options for changing the size of the border under header main area
5. Choose the color from the Border Bottom color option to change the border color
6. Choose the color from the Background color option to change the background color or upload image from the Background Image option for the header
7. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. Button Text: This field is used to insert the text for showing on the button
2. Button Link: Insert the link in this field for redirecting the button to the link
3. Open in a new tab: Switch on this option to open the link in a new tab when the button is clicked
4. Text Color: It can be used to change the color of the text in the button
5. Text Hover Color: It can be used to change the color of the text in the button on hover
6. Background Color: This option can be used to change the background color of the button
7. Background Hover color: This option can be used to change the background color of the button on hover
8. Roundness: Slider the slider for changing the border radius of the button and make it round
9. Padding: This option can be used to increase or decrease the padding in the button
10. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Menu > Primary Menu section.
2. Switch off the Disable Primary Menu option to show the header top bar options
3. Switch on the Keep Menu Items on One Line option to show the menu in one line and show the rest of the menu which doesn’t fit in one line only on clicking more option( i.e., three vertical dots)
4. Choose the color from the Menu Item Color option to change the color of the menu
5. Choose the color from the Menu Item Hover Color option to change the color of the menu while hovering the mouse over it
6. Choose the color from the Menu Item Active Color option to change the color of the selected menu
7. Select the border under the Active Menu Item Style options for showing the border around the active menu
8. Slide the slider under the Border Bottom options for changing the size of the border under the primary menu
9. Choose the color from the Border Bottom color option to change the border color below the menu
10. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > General section.
2. Choose the style from the Container Style option to change the style of the container
3. Slide the slider under the Container Width options for changing the width of the container
4. Slide the slider under the Content Width options for changing the width of the content
5. Slide the slider under the Sidebar Width options for changing the width of the sidebar
6. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. 1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Post/Page/Blog > General section.
   2. Under the Page Title, choose one of the options to show Page Title on different locations: Page Header: Show the Page Title on the Page Header.                                                                                                                                                                                                  Content Area: Show the Page Title on the Content Area.
       
   3. If you select the Page Header option, In the Markup option, select the heading which contains the Page Title
   4. Choose the color from the Text Color option to change the color of the Page Title
   5. Slide the slider under the Font size option for changing the size of the Page Title in the container
   6. Choose the alignment of the Page Title and Breadcrumb under the Alignment option from the available alignments. If the Breadcrumb is switched off, only Page Title alignment will be shown

1. Insert the padding value in the box under the Padding option to increase or decrease the padding between the Page Title and its border
2. Choose the background color under the Background Color option to change the background color of the Page Title
3. If you want to use an image instead of color, choose the background image under Background Image option to change the background image of the Page Title 
   It is shown in the image as below:                                                                                                                                                     
4. Switch on the Enable Breadcrumb option to show the breadcrumb in the page header
5. Slide the slider under the Font size option for changing the size of the Breadcrumb in the page header
6. Choose the color from the Text Color option to change the color of the Breadcrumb
7. Choose the color from the Separator Color option to change the color of the selector in the Breadcrumb
8. Choose the color from the Link Color option to change the color of the link in the Breadcrumb
9. Choose the color from the Link Hover Color option to change the color of the link on hover in the Breadcrumb
10. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Post/Page/Blog > Blog/Archive section.
2. Drap and drop the items in the Post Content Order option to give priority for showing items on the top or bottom
3. Drap and drop the items in the Meta Tags Order option to give priority for showing items on the top or bottom
4. Choose the Excerpt or Content under the Post Content option to show the excerpt of the post/page or full content
5. Switch on the Enable Read More option to show the read more link when the Excerpt option is selected
6. Choose the style under the Read More Style option to show the read more link either in the left or right side of the content                                                                                                                                                                                
7. Click on the Publish button to save the changes made on the site.
   It is shown in the image as below:
   

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Post/Page/Blog > Single Post section.
2. Drap and drop the content items in the Single Post Content Order option to give priority for showing items on the top or bottom
3. Drap and drop the meta items in the Meta Tags Order option to give priority for showing items on the top or bottom
4. Click on the Publish button to save the changes made on the site.
   Post Order is shown in the image below:
   Meta Order is shown in the image below:
   

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Layout > General section
2. In the Default option, choose the layout from the available layout options such as Content centered, Left sidebar, Right sidebar, No sidebar & Stretched.
   A centered layout of the search page is shown in the image below:                                         
    
3. In the Blog/Archive option, choose the layout for blog or archive from the available layout options such as Content centered, Left sidebar, Right sidebar, No sidebar & Stretched.
   Left sidebar layout of the blog page is shown in the image below:
   
4. In the Single Post option, choose the layout for the single post from the available layout options such as Content centered, Left sidebar, Right sidebar, No sidebar & Stretched.
   Right Sidebar of the single post page is shown in the image below:
   
5. In the Page option, choose the layout for pages from the available layout options such as Content centered, Left sidebar, Right sidebar, No sidebar & Stretched.
   A full-width layout of the page is shown in the image below:                                                                                                                                                   
6. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Styling > Base Colors section.
2. Choose the color from the Primary Color option to change the color of the site
3. Choose the color from the Text Color option to change the color of the text on the site
4. Choose the color from the Border Color option to change the color of the border on the site
5. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Layout > General > Link Colors section.
2. Choose the color from the Link Color option to change the color of the link on the site
3. Choose the color from the Link Hover Color option to change the color of the link on hover on the site
4. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Layout > General > Button section.
2. Choose the color from the Text Color option to change the color of the button on the site
3. Choose the color from the Text Hover Color option to change the color of the button text on hover on the site
4. Choose the color from the Background Color option to change the color of the button background on the site
5. Choose the color from the Background Hover Color option to change the color of the button background on hover on the site
6. Slide the slider under the Roundness option for changing the edge of the button on the site
7. Insert the padding value in the box under the Padding option to increase or decrease the padding in the button
8. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Base Typography section.
2. Under the Body option, choose the customization for body fonts such as Font family, Variant, Font size and Line Height. The image showing body font in a single post is as below:                                                                                 
3. Under the Heading option, choose the customization for heading fonts such as font family, variant, font size and Line Height. The image shows heading typography is as below:                                                                                             
4. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Site Identity section.
2. Under the Site Title option, choose the customization for site title fonts such as Font family, Variant, Font size and Line Height.
3. Under the Tagline option, choose the customization for tagline fonts. The image showing Site Title and Tagline typography are as below:
4. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Primary Menu section.
2. Choose the customization for primary menu fonts such as Font family, Variant, Font size and Line Height.
3. Choose the customization for drop down sub menu of the primary menu
   The image showing Primary Menu typography is as below:                                                                                         
4. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Mobile Menu section.
2. Choose the customization for Mobile menu fonts such as Font family, variant, Font size and Line Height.
   The image showing Mobile Menu typography is as below:                                                                                         
3. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Post/Page Title section.
2. Choose the customization for Post/Page title fonts such as Font family, Variant and Line Height.
   The image showing Post/Page Title typography is as below:                                                                                         
3. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Blog/Archive Post Title section.
2. Choose the customization for Blog/Archive Post Title fonts such as Font family, Variant, Font size and Line Height.
   The image showing Blog/Archive Post Title typography is as below:                                                                                         
3. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Headings(H1 – H6) section.
2. Choose the customization for Headings i.e. from Heading 1 to Heading 6. Typography options available for headings are Font family, Variant, Font size and Line Height.
   The image showing Heading(H2) typography is as below:
3. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Typography > Widgets section.
2. Under the Title option, choose the customization for widget title fonts such as Font family, Variant, Font size and Line Height.
   The image showing typography for widget title is as below:
3. Under the Content option, choose the customization for widget content. Typography options available for widget content are Font family, Variant, Font size and Line Height.
   The image showing typography for widget content is as below:
4. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

1. 1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Footer > Footer Widgets section.
   2. Switch on the Enable Footer Widgets to show footer widget in the footer
   3. Under the Footer Widgets option, choose the Style such as one column, two columns, three columns or four columns for footer widgets

1. Under the Footer Widgets option, choose the Background Color/Background Image for footer widgets
   
2. Slide the slider under the Border Top option for changing the size of the border above the Footer widget
3. Under the Footer Widgets option, choose the Border Top Color for border above footer widgets
4. Switch on the Hide Widgets Title to hide the title in the footer widget
5. Choose the color from the Widget Title Color option to change the color of the title in the footer widget
6. Choose the color from the Text Color option to change the color of the text in the footer widget
7. Choose the color from the Link Color option to change the color of the link in the footer widget
8. Choose the color from the Link Hover Color option to change the color of the link on hover in the footer widget
9. Slide the slider under the List Item Border Bottom option for changing the size of the border under the item in the Footer widget
10. Choose the color from the List Item Border Bottom Color option to change the color of the border under the item in the footer widget
11. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. Style: There are two styles available in the Footer Bottom Bar. They are Left & Right align and another is center aligned. Choosing the first style will show Left Content as left align and Right Content as right align. Choosing the second style will show the Left Content above and Right Content below it with center align in the footer bottom bar.
   The first style is shown below:
   
   The second style is shown below:
   
2. Left Content: Various options can be selected in the left content such as displaying empty space, displaying text, showing the menu or the widget. The select options under the Left content are:
   • None: Choosing none will show that section as empty
   • Text/HTML: This option will allow showing text or HTML element in the left section. After selecting Text/HTML a text editor will be shown below to add or edit the content
   • Menu: After choosing the menu in the left content, an option will be shown below it to select the menu from different available menus for showing in the left content
   • Widget: If you choose to display Widget under the Left Content option, then go back to Appearance > Widgets, there will be a sidebar named Footer Bottom Bar Left Sidebar. Insert the widget in that sidebar to show that widget in the footer bottom bar
3. Right Content: The procedure for the right content is the same as in step 2. You can simply follow step 2 to manage content in the right content
4. Text Color: It can be used to change the color of the text in the footer bottom bar
5. Link Color: The color of the link in the footer bottom bar can be changed using this option
6. Link Hover Color: It can be used to change the color of the link on hover
7. Border Top: It can be used for changing the size of the border above the Footer bottom bar
8. Border Top Color: The color of the border above the footer bottom bar can be changed using this option
9. Background: Background option contains Background Color & Background Image for the footer bottom bar. You can choose either the color or the image in the background for footer bottom bar
10. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to Appearance > Customize > Theme Options > Footer > Scroll to Top section
2. Switch on the Enable Scroll to Top option to show the Scroll to Top icon in the footer
3. Choose the color from the Color option to change the arrow icon color of the scroll to top in the footer
4. Choose the color from the Hover Color option to change the arrow icon color on hover in the scroll to top
5. Choose the color from the Background Color option to change the background color of the arrow icon in the scroll to top
6. Choose the color from the Background Hover Color option to change the background color of the arrow icon on hover in the scroll to top
7. After you have chosen the required option, you can now click on the Publish button to save the changes on your site.

It is shown in the image below:

1. From your WordPress Dashboard, go to the Pages section
2. Now, choose the required Page you want to customize
3. At the bottom of the page, check for the Page Settings option
4. Under the Page Settings option, go to the General option
5. Under the Layout option, select the layout from the available layouts for pages such as a right sidebar, left sidebar, boxed layout, and full-width content or select the first option ( i.e., From Customizer) for selecting the layout from the customizer
6. Under the Remove content margin option, check the checkbox to remove the content margin
7. Under the Sidebar option, choose which sidebar content to show( i.e., if you have chosen the left sidebar in the above layout option and you chose the right sidebar in the Sidebar option, then the content of the right sidebar will be shown in the left sidebar)
8. After you have chosen the required option, you can click on the Publish button to save the changes made on the site. It is shown in the image below:
   

1. From your WordPress Dashboard, go to the Pages section.
2. Now, choose the required Page you want to customize
3. At the bottom of the page, check for the Page Settings option
4. Under the Page Settings option, go to the Header option
5. Under the Enable Transparent Header option, check the checkbox for making the Header transparent
6. Under the Logo option, click on Upload Logo to show on the logo on the page
7. Under the Style option, choose the style for the Header( If From Customizer option is selected, then the setting saved in the customizer will be used)
8. After you have chosen the required option, you can click on the Publish button to save the changes made on the site. It is shown in the image below:                                                                                                                                                                                                        

1. From your WordPress Dashboard, go to the Pages section.
2. Now, choose the required Page you want to customize
3. Below the editor, go to the Page Settings option
4. Under the Menu Item Color option, select the color for the menu
5. Under the Menu Item Hover Color option, select the color for the menu to show on hover
6. Under the Menu Item Active Color option, select the color for the active menu item
7. Under the Active Menu Item Style option, select whether to show the border in left, right or bottom of the active menu item or not to show the border
8. After you have chosen the required option, you can click on the Publish button to save the changes made on the site. It is shown in the image below:
   

1. From your WordPress Dashboard, go to the Pages section.
2. Now, choose the required Page you want to customize
3. Below the editor, go to the Page Settings option
4. Under the Page Header option, check the checkbox to enable the Page Header( In the Page title option of the customizer, if you have chosen Page Header, then the heading will be removed, but if you have chosen the Content Area then the heading will be shown in the content)
5. After you have chosen the required option, you can click on the Publish button to save the changes made on the site. It is shown in the image as below: