Appeal - Fully Functional
Petition WordPress Theme Documentation

Installation Steps

To install a theme, you must first upload the theme files and then activate the theme. The theme files can be uploaded in two ways:

• FTP Upload: Using your FTP client, upload the non-zipped theme folder into the /wp-content/themes/ folder on your server.
• WordPress Upload: Navigate to Appearance >> Themes >> Add New >> Upload. Go to browse, and select the zipped theme folder. Hit "Install Now" and the theme will be uploaded and installed.

Step 01: Go to WP admin dashboard and click on Appearence >> Themes >> Add New.

Step 02: Click on Upload Theme.

Step 03: Browse the file appeal.zip which you'll have from the download and click on Install Now .

Step 04: Activate the theme.

Step 05: Click on Begin Installing Plugins link.

• One Click Demo Import. (Required)
• WPBakery Page Builder. (Required)
• Codeecstasy Theme WPBakery Page Builder Helper. (Required).
• Petitions Manager. (Required)
• Redux Framework. (Required)
• Contact Form 7.(Required)
• Mailchimp For Wp. (Required)
• BWL News Manager,. (Required)
• Shortcodes Ultimate. (Required)
• Woocommerce. (Optional, If you want to run a shop install and activate it).
• Widget Importer & Exporter. (Required, but you can deactivate it after import demo data).
• WordPress Importer. (Required, but you can deactivate it after import demo data).

N.B: All plugins must be installed and activated if you want your site to look exactly like demo.

Step 06: Select the plugins to Install and click Apply.

Step 07: After install the plugin click on Return to Required Plugins Installer.

Step 08: Select the plugin to Activate and click Apply.

Step 09: After active the plugin click on Return to the Dashboard.

Child Theme Installation:

The Installation process of a child theme is similar to the main theme. Please note that, A Child theme is for developers who willing to make changes to core functions and code. You will get all the necessary files for the child theme inside the theme package.

Import Demo Data

Building a site from the beginning always difficult as well as time-consuming. So, we provide the most popular One Click Demo Installation option, and you can easily get your site exactly like our theme demo within a few minutes.

Few Important Notes:

• Make sure that Appeal Parent Theme has been installed and activated in your site.
• Your previous data and settings may be removed or modified after importing demo data. So, we profoundly recommend importing demo data in a fresh WordPress site.
• It may take a bit long time to import all the images and demo data from our server. So, please keep patience while importing process is running in your site. In general case, It will not take more than 3-5 minutes.
• You can deactivate One Click Demo Import plugin after completing import task.

Please follow the steps -

Step 01: Make sure you have installed and activated One Click Demo Import plugin.

Step 02: Go to Appearance >> Import Demo Data page.

Step 03: Click Import Demo Data button. It will take few min to complete import process. So, keep patience until import process completed successfully.

Step 04: Once completed import process successfully, you will get following success message.

Step 05: Check Result -

Setup Favicon

Step 01: From WP admin menu, navigate to Appeal Options >> General tab.

Step 02: Upload the site favicon. ( Recommended favicon size is 64x64 and file type in PNG format. )

Step 03: Finally, click Save Changes button to save the settings.

OUTPUT:

Customize Pre Load Screen

Step 01: From WP admin menu, navigate to Appeal Options >> General tab.

Step 02: Set the Disable Preloader? option to ON, If you would like to disable the pre load screen.

Step 03: You can also upload custom icon( Recommended size is 64x64 and file type in GIF format. ) and set custom background color for the preloadscreen. Finally, click Save Changes button to save the settings.

OUTPUT:

Customize Back To Top Button

Step 01: From WP admin menu, navigate to Appeal Options >> General tab.

Step 02: Set the Disable Back To Top? option to ON, If you would like to disable the button.

Step 03: You can also set custom background for the button. Finally, click Save Changes button to save the settings.

OUTPUT:

Setup Site Logo

Step 01: From Admin menu, navigate to Appeal Options >> Header >> Logo tab.

Step 02: You can set custom logo for your site, set text logo and set padding/margin according to your requirement.

Step 03: Finally, click Save Changes button to save the settings.

OUTPUT:

Tool Bar Customization

Appeal WordPress theme brings two type of toolbar layout styles.

Toolbar Layout 01:

Step 01: From Admin menu, navigate to Appeal Options >> Toolbar tab.

Step 02: You can enable/disable toolbar. You can also customize toolbar color, font size, texts and set padding according to your requirement.

Step 03: Finally, click Save Changes button to save the settings.

Layout 01 HTML Code:

Toolbar Left Content:

<span class="margin-right20">
<i class="fa fa-phone-square"></i> (+01) 284-5321-5831
</span>

<a href="mailto:info@appeal.org">
<i class="fa fa-paper-plane"></i> info@dynamism.org
</a>

Toolbar Right Social:

<span class="margin-right20">
<i class="fa fa-map-marker"></i> 504 Syl Avenue, Sylhet 1214, Finland
</span>

Toolbar Right Button:

<a href="#" class="free-estimate">GET FREE QUOTE</a>

Customize Menu/Navigation Color

Step 01: From Admin menu, navigate to Appeal Options > Header > Navbar tab.

Step 02: You can customize menu color, menu item background, menu fonts and set padding/margin according to your requirement.

Step 03: Finally, click Save Changes button to save the settings.

Footer & Copyright Text

Step 01: From Admin menu, navigate to Appeal Options >> Footer tab.

Step 02: You can set custom copyright text according to your requirement. You can also disable this copyright text section.

Step 03: Finally, click Save Changes button to save the settings.

OUTPUT:

Setup theme Typography, background, Heading & Sidebar(Widget) styles

Step 01: From Admin menu, navigate to Appeal Options >> Styling Options >> Body Styling tab.

Step 02: You can set body background, fonts, text size, link colors according to your requirements. Also, you can manage heading(h1,h2,h3,h4,h5,h6) color and font size. You can set theme sidebar(widget) background and fonts from body styling section.

Step 03: Finally, click Save Changes button to save the settings.

Default Header Styling

Step 01: From Admin menu, navigate to Appeal Options >> Styling Options >> Header Styling tab.

Step 02: You can enable/disable sticky header option from here. Also, set custom font and background color of default header and after sticky position font and background color.

Step 03: Finally, click Save Changes button to save the settings.

OUTPUT:

Footer/Bottom Widget Styling

Step 01: From Admin menu, navigate to Appeal Options >> Styling Options >> Bottom Styling tab.

Step 02: You can set custom background image and background color bottom. Also, customize bottom widget fonts and colors.

Step 03: Finally, click Save Changes button to save the settings.

OUTPUT:

Petition Home Page

Step 01: First you have to create a petition using Petitions Manager WordPress plugin Check the Plugin documentation for details.

Step 02: Go to Pages >> Add New from the left panel. Next, Input the title Home 1 of the page. From the right side Page Attribute, select One Page Header1 from the Template selection dropdown. From The right side Page Layout Settings select "WPBakery Page Builder Page" to "Yes".

Step 03: Click on Backend Editor and achieve Classic Mode to achieve WPBakery Page Builder drag n drop process.

Step 04: Click on Add New Element to achieve a Row of WPBakery Page Builder.

About Us Page

Step 01: Go to "Pages >> Add New" from the left panel.

Step 02: Input the title "About Us" of the page. From the right side Page Attribute, select Home Page from the Template selection dropdown. From The right side Page Layout Settings select "WPBakery Page Builder Page" to "Yes" .

Step 03: Click on Backend Editor to achieve WPBakery Page Builder drag n drop process.

Step 04: Click on Add New Element to achieve a Row of WPBakery Page Builder.

Step 05: Inside the Row you can add different elements by drag n drop WPBakery Page Builder.

Step 06: We add WPBakery Page Builder Elements to achieve the about page layout, you should see WPBakery Page Builder in the Documentation Folder.

Step 07: Here are the screenshot of Different Elements we used in the About Us page.

Contact Page

Step 01: Go to Contact >> Add New from the left panel.

Step 02: Add the title Contact form 1 of the Contact Form. Then, add follwoing lines Setup the From portion of the contact from(Ex: See the following screenshot).

Get Contact Form Shortcode:

Navigate to Contact >> Contact Forms page. You will get the lists like the following screenshot.

Contact Form (Default Layout) Code:

We strongly recommend to use the following codes to generate contact form layout.

[text* your-name placeholder "Name"]
[email* your-email placeholder "Email"]
[text* your-subject placeholder "Subject"]
[textarea* your-message 40x5 placeholder "Your message here"]
[submit class:btn-theme class:btn-square class:btn"Send Message"]

Shortcode:

Please Note: The value of id tag in shortcode may be different for your site. Additionally, You can include additional class appeal-contact-form to get the alternative contact form layout.

[contact-form-7 id="5" title="Contact Form"]

[contact-form-7 id="5" title="Contact Form" html_class="appeal-contact-form"]

Contact Form (Default Layout) Output:

Step 03: Setup the Mail portion of the contact from (Ex: See the following screenshot)

Recommendation: https://www.youtube.com/watch?v=PV26aJ05zXM

Step 04: Setup the Messages portion of the contact from (Ex: See the following screenshot)

Step 05: Click Save to save the Form and you'll get a form short code which we'll paste in a page to achieve the form output.

Step 06: Go to "Pages > Add New" from the left panel.

Step 07: Input the title "Contact 1" of the page. From the right side Page Attribute, select Home Page from the Template selection dropdown. From The right side Page Layout Settings select "WPBakery Page Builder Page" to "Yes".

Step 08: Click on Backend Editor to achieve WPBakery Page Builder drag n drop process.

Step 09: Click on Add New Element to achieve a Row of WPBakery Page Builder.

Step 10: Inside the Row you can add different elements by drag n drop WPBakery Page Builder.

Step 11: We add WPBakery Page Builder Google Map, Info Box and Text Block Elements for this page.

Step 12: You should see the WPBakery Page BuilderDocumentation Folder.

Step 13: Setup the Google Map Elements Latitude and longitude to achieve the map.

Step 14: Paste the short code into the Text Block (Ex: like following you'll have a short code).

[contact-form-7 id="2209" title="Contact Form" html_class="appeal-contact-form"]

Step 15: Here are the screen shot of Different Block Elements we used in the Contact 1 page.

Blog Page

Step 01: Click on Posts >>Categories from the admin side left panel and create post Categories.

Step 02: Click on Posts >> Add New from the admin side left panel and create post under the Categories. Set the right side Appeal Metabox according to your needs for single post view.

Step 03: Click on Pages>>Add New from the admin side left panel and input Page Title.

Step 04: In the right side Page Attributes set the Template to Blog Both Sidebar, Blog Full Width, Blog Left Sidebar, Blog Right Sidebar, Blog Sidebars in Left or Blog Sidebars in Right, whatever layout you want from the dropdown.

WooCommerce Store

Step 01: After installing the WooCommerce plugin during the theme installation you'll have all the pages (Cart, Store, My Account, Checkout) in the left panel Appearnce >> Menus. Going to left panel Appearnce >> Menus add these item to the main menu.

Step 02: To add a WooCommerce category go to Products >> Categories from the left panel and then add new product Category.

Step 03: To add a WooCommerce Products go to Products >> Add Product from the left panel and then add new products under any Categories.

Step 04: Now you should see all the added new products in the front end Store/Shop Page.

Step 05: if you want to use WooCommerce as an advance user then refer this link WooCommerce Docs , you'll have all the things as an advance user.

Primary Menu/Main Menu

Step 01: Navigate to Appearance>>Menus . From the Select a menu to edit: drop down select Main Menu and click Select button. Next, from the Add menu items panel choose the required menu items and click Add to Menu button.

Step 02: Now, click on the Manage Locations tab to set primary menu. Select Menu Menu from the Assigned menu drop down and click Save changes button.

OUTPUT:

Footer Menu

Step 01: Navigate to Appearance>>Menus . From the Select a menu to edit: drop down select Footer Menu and click Select button. Next, from the Add menu items panel choose the required menu items and click Add to Menu button.

Step 02: Now, click on the Manage Locations tab to set primary menu. Select Footer Menu from the Assigned menu drop down and click Save changes button.

OUTPUT:

One Page Menu

Step 01: Navigate to Appearance>>Menus . From the Select a menu to edit: drop down select One Page Menu and click Select button. Next, from the Add menu items panel choose the required menu items and click Add to Menu button.

Step 02: Now, click on the Manage Locations tab to set primary menu. Select One Page Menu from the Assigned menu drop down and click Save changes button.

Blog Widget Area

OUTPUT:

Step 01: To translate the theme texts, please download and install Poedit software in your computer. Here goes the download link- https://poedit.net/download

Step 02: Next, navigate to /wp-content/themes/appeal/languages/. You will get a file named 'appeal.pot'.

Step 03: For example, we want to translate our theme text in to Dutch language. So, copy 'appeal.pot' file and rename it to 'de_De.pot'

Step 04: Now, open that newly created 'de_De.pot' file using Poedit software. You will get all the theme texts in there and you just need to add appropriate translated text in Translation box.

Step 05: Finally, save the file and you'll get 'de_De.mo' file inside languages folder.

Check Video Tutorial

Upgrading to version 1.3.3

• Replace all files and directories in your themes/appeal folder.

2023, January, 05 - v 1.2.0

- Updated: Theme for WP version 6.1.1
• - Updated: WPBakery Page Builder to 6.10.0
• - Updated: Theme options panel.
• - Updated: Theme language/translation file.
• - Updated: Theme documentation.

2021, December, 31 - v 1.1.8

• - Updated: WPBakery Page Builder to 6.8.0
• - Updated: Theme Options Panel.
• - Updated: Theme language/translation file.
• - Updated: Theme documentation.

2021, July, 25 - v 1.1.7
- Updated: WPBakery Page Builder to 6.7.0
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2021, March, 15 - v 1.1.6
- Updated: WPBakery Page Builder to 6.6.0
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2020, December, 02 - v 1.1.5
- Updated: WPBakery Page Builder to 6.4.2
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2020, December, 02 - v 1.1.5
- Updated: WPBakery Page Builder to 6.4.2
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2020, October, 02 - v 1.1.4
- Updated: WPBakery Page Builder to 6.4.1
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2020, January, 17 - v 1.1.3
- Updated: WPBakery Page Builder to 6.2
- Updated: Petitions Manager to 1.0.8 (Check Petitions Manager Plugin Change Log)
- Updated: BWL News Manager to 1.0.1
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2020, January, 24 - v 1.1.2
- Updated: WPBakery Page Builder to 6.1
- Updated: Petitions Manager to 1.0.7
- Updated: Theme Options Panel.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2019, August, 21 - v 1.1.1
- Updated: WPBakery Page Builder to 6.0.5
- Updated: Petitions Manager to 1.0.6
- Updated: Theme Options Panel.
- Fixed: Back To Top button issue for mobile device.
- Improved: responsive layout for mobile device.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2019, February, 16 - v 1.1.0
- Updated: WPBakery Page Builder to 5.7
- Updated: Theme Options Panel.
- Updated: Child theme.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2019, February, 07 - v 1.0.9
- Fixed: Menu Issue.
- Updated: Petitions Manager Plugin.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2019, January, 01 - v 1.0.8
- Updated: Visual Composer Version.
- Updated: Petition Manager Plugin.
- Updated: Theme language/translation file.
- Updated: Theme documentation.

2018, October, 29 - v 1.0.7
- Fixed: Version number to conflict issue with another theme on the WordPress.org repository.

1. Bootstrap
   
2. jQuery Plugin
   
3. Owl Carousel
   
4. Google Fonts
   
5. Font Awesome
   
6. Google Maps API
   
7. Freepik.com
   
8. Pexels.com

WordPress Themes

WordPress Plugins

HTML5 Themes