Charitus

Donation Non Profit Charity Website WordPress The


Thank you

If you download the full package of this theme, unzip the package. You will see a installable zip file there.

You can install the theme in your site by FTP or WordPress admin.

Installing the theme form WordPress dashboard:

Login to your WordPress site, navigate to Appearance > themes. Click on the Add New, then click on the Upload theme button.

 

 

Choose the Installable WordPress theme here and click install now button. Then it will take few seconds depending upon your internet speed to upload it. After uploading the theme to will see a link to active the theme. Click the active link to active the theme.

 

Installing the theme form FTP:

Login to your site’s FTP from any FTP client like FileZillaCyberduck etc. Go to the wp-content folder > themes. Unzip the installable theme file and upload it to the themes directory.

After upload complete go to your site admin and navigate to Appearance > themes. You will see this theme there. Click the active button to active the theme.

After installing this theme, most important task to do is install the required plugins.

 

Note: Make sure you active the main theme, not the child theme, after installing the plugins you can move to the child theme.

 

You will be notified to install few plugins just after activation of the theme. Some plugins are required and some are recommended.

You must have to install the required plugins.

You can install all the plugins at once, select all the plugin by clicking the check box and select install form the dropdown and click apply.

Charitus CPT and Shortcode plugin contain all the ShortCodes and custom post type for this theme. And Charitable plugin is the donation system core, what we are using for this theme. In our theme demo we are using some premium Charitable plugin extensions which are not included with this theme. We added support those premium extensions support in our theme. If you need any of these extensions you can buy these from the link bellow.

 

https://www.wpcharitable.com/extensions/

 

Image: Plugin install notice 

 

Importing demo content

Before importing the demo content of this theme, make sure you installed all the required plugins.

You will be suggested to install the required plugins after activating this theme.

Next navigate to Appearance > Import Demo Data. Here click on the Import Demo Data button. It will take few minutes depending upon your internet connection. By this time don’t close the browser window. After importing process complete you will be notified.

 

 

 

Menu Setup:

After importing the demo content first step is to setup the menu and the home page.

Navigate to the Appearance > Menu. Go to the menu location tab and select main menu and the footer menu like the screenshot bellow –

 

 

Home Page Setup:

Navigate to Settings > Reading. Choose ( Static Page ) for front page display. And select the Home & Blog page form the page selection dropdown. After choosing the pages make sure you save the settings.

This theme support multiple home pages example, so you can select any home page for the front page.

 

 

 

After importing the demo content you have to select the required pages for the donation system.

Go to > Charitable > Settings > In general tab bellow the page you can see like the screenshot bellow. Set the pages in the dropdown as I set in the screenshot.

Login , Registration, Profile, Campaign submission pages are required.

Campaign submission is coming from the Charitable Ambassadors extension.

 

 

 

 

If you follow this documentation step by step, import demo data and select menu location, you are going to see the demo menu in your site.

Now follow the instruction bellow for adding you own menu to the main menu location in the header. It’s same process like other themes.

 

 

Navigate to Appearance > Menus. Here you will see a link for create a new menu. Click on that link and give a name of your menu and save the menu.

Now add you menu items. This theme support multi level dropdown menu. After adding menu item save the menu.

Now go to the menu locations tab.

 

 

Here you can see the menu locations that this theme comes with. The primary menu is going to show in the header. From the menu selection dropdown, select the menu that you created few minutes before. That’s it.

Logo Change:

For changing the logo, navigate to the Appearance > Customizer. Go to the Site Identity tab.  Here you can upload your Logo.

For best result use resized logo image, Suggested size is 166×46 pixel.

 

 

 

 

 

Site Information: 

You can update the information ( site title and tagline ) form customizer and the general settings.

If you see the logo change screenshot you can see the site information input fields as well.

If you want to update those information form the general setting, Navigate to the Settings > General settings.

Here you can see the input fields for update those information. Make sure you update the site email address.

 

 

 
 

 

Go to your site dashboard > Theme Options. Here you will see all the theme settings. Customize the theme as your need.

 

 

If you see the demo of this theme, you may notice there is a pre header bar before the header with menu and button.

You can customize and update those information form the pre header settings under the  theme option.

You can enable / disable the pre header, change style and update the pre header content form here.

 

 

This theme support conditional page add in the pre header right. You can add login / registration pages or any other pages here.

 

here the output.

 

 
 

 

Theme header style ( header  background , color  ), menu style ( background, color, width ) can be adjust from here.

 

 

 

 

 

You can adjust theme common styles from here. Font size, background color, body font color, theme primary colors everything can be adjust from here.

 

 
 

 

All the blog related settings like feature image width and height, layout, post navigation and author bio can be adjust from the blog settings.

 

 

 

This theme support Charitable donation plugin. It allow you to create donation campaign and rise donations. You can customize the donation related settings from the Donation settings. Single campaign page and campaign grid and slider can be adjust from here.

 

 
 

 

This theme comes with full WooCommerce support. You can sell any kind of products using this theme.

We added some settings to customize the WooCommerce pages and element as well.

You can set page layout for shop page and single product page, number of products to show in the WooCommerce shop page, products columns etc from here.

 

 
 

 

Theme customizer allow you customize the site real time. You can see the changes at same time you make any change in customizer settings.

Most of the options in customizer are coming from the WordPress core, which allow you to customize site information, logo, menu, widgets, static front page etc.

 

 

 

 

We added header settings in the customizer. It will allow you to adjust the logo top & bottom space adjust and main menu items top , bottom, left and right space adjust.

 

 

 

 

 

 
 

 

Creating a new page is super easy. No complex options and settings.

Just navigate to Pages > Add New. Put a title of your page.

 

 

 

This theme support Visual Composer page builder plugin, you can easily create pages with this page builder. Click on the backend editor button to switch the builder mode. You can find some video tutorials about Visual Composer in the link bellow –
https://vc.wpbakery.com/video-tutorials/

All of this theme’s ShortCodes are available as Visual Composer addons, if you click on the add element button you will see a custom tab named “Charitus” which contain all of our custom VC elements.

You can place any of these ShortCode anywhere to your page.

 

 

 

 

 

Page settings :

On the right side of the page add / edit page you can see this page settings box. These are custom page settings. You can customize page layout, enable or disable the page title, pre header, sidebar, header type etc from here. You can select specific sidebar for any page. If you enable page sidebar you will see all the sidebar in a dropdown.

This theme support two different page layout. Fullwidth and Box layout.

If you want to make a page with simple text only, use the Box layout. And use the Fullwidth layout for making page with Visual Composer.

For example you can see our demo pages.

 

 

 

This theme comes with full support of Charitable donation plugin. You can create donation campaign and rise donation using this plugin.

For full documentation of Charitable donation plugin go to the following link

https://www.wpcharitable.com/documentation/

 

 

  1. In your WordPress dashboard, go to Charitable Add Campaign.
  2. Enter your campaign title. Try something action-oriented or catchy; your goal is to attract people’s attention.
  3. Add a short description. Aim for something short but sweet that clearly communicates the purpose of your campaign.
  4. If you have a specific fundraising target, you can add a fundraising goal.
  5. If your campaign needs to end on a certain date, you can set an end date. Leave this blank for ongoing fundraising campaigns.
  6. Next, scroll down to the Donation Options area. Here, you can add suggested donation amounts and choose whether to allow custom donations, where the donor can donate any amount they choose.
  7. Next, click on Extended Description. Write more about your campaign or add photos.
  8. If you have a lot of campaigns, you can group them by category or tag with the Campaign Categories and Campaign Tags boxes on the right side of the screen.
  9. Finally, if you have a photo or image to go along with your campaign, you can add this using the Featured Image box.
  10. Now it’s a good idea to take a look at your campaign. Click the Preview button inside the Publish box to see how your campaign is looking.
  11. Once you are happy with your campaign, click on Publish. Your fundraising campaign is now live!

 

 

 

If you see this theme demo, you may be see there is a section for clients testimonials.

You can add testimonials form the admin area. Navigate to testimonials > add new. Put the client name in the title box and the testimonial in the content box. Upload a feature image for client image.

 

 

 

 

 
 

 

We are using a free plugin named “The event calendar” for showing the events. It is the best plugin for event management system in WordPress.

 

 

For adding a new events, navigate to Events > add new. Put your event name, description, date & time, location, price, image etc. then click publish.

Its more or less similar to adding a new post.

Checkout the event calendar plugin knowledge base for details documentation for this plugin.

 

 

 
 

 

We are using Contact Form 7 plugin for this theme, It’s one of the best contact form plugin for WordPress.

 

 

You can use default form that comes after installing this plugin or you can use or customize form like the demo.

Go to the Contact > Add New. Here you will see a default form code like the screenshot bellow.

 

 

Replace the form code by the code bellow, it will make the form like you demo.

For contact form :

 

  <div class="row">
  <div class="form-group col-md-6">
  [text* id:name class:form-control placeholder "Name*"]
  </div>
  <div class="form-group col-md-6">
  [email* email id:email class:form-control placeholder "Email*"]
  </div>
  </div>
  <div class="form-group">
  [textarea* message id:message class:form-control class:input-lg placeholder x6 "Message*"]
  </div>
  <div class="form-submit-btn">
  [submit id:form-submit class:btn class:btn-fill class:btn-lg "Send Message"]
  </div>

 

For become a volunteer form : 

  <div class="form-group">
  <label>Name*</label>
  [text* id:name class:form-control]
  </div>
  <div class="form-group">
  <label>Email*</label>
  [email* email id:email class:form-control]
  </div>
  <div class="form-group">
  <label>Phone*</label>
  [tel* tel-377 class:form-control]
  </div>
  <div class="form-group">
  <label>Address*</label>
  [text* text-730 class:form-control]
  </div>
  <div class="row">
  <div class="form-group col-md-6">
  <label>City</label>
  [select menu-237 class:form-control include_blank "New York" "Chicago" "Houston" "Philadelphia" "Phoenix" "San Antonio"]
  </div>
  <div class="form-group col-md-6">
  <label>State/Region</label>
  [select menu-805 class:form-control include_blank "New York" "Chicago" "Houston" "Philadelphia" "Phoenix" "San Antonio"]
  </div>
  </div>
  <div class="row">
  <div class="form-group col-md-6">
  <label>Zip/Postal Code</label>
  [text text-133 class:form-control]
  </div>
  <div class="form-group col-md-6">
  <label>Country</label>
  [text text-173 class:form-control]
  </div>
  </div>
  <div class="form-group">
  <label>Message</label>
  [textarea message id:message class:form-control x5]
  </div>
  <div class="form-submit-btn">
  [submit id:form-submit class:btn class:btn-fill class:btn-lg "Submit"]
  </div>

 

Finally it will look like the screenshot bellow –

 

 

 

Save the form, and go to the contact page and edit the contact page. Here in the visual composer you will see the contact form element. Edit the element in the form select dropdown select the form that you created few minute before.

 

 

 

 

 
 

 

We are using WooCommerce plugin for the store. You can follow the WooCommerce official knowledge base for details documentation.

 
 

 

This theme comes with six deferent sidebar areas.

Sidebar areas: 

  1. Blog Sidebar
  2. Donation Cause Sidebar
  3. Events Sidebar
  4. Footer widgets
  5. WooCommerce Shop
  6. WooCommerce Product

 

 

 

Blog Sidebar :

Blog sidebar will works for post, single post and post archive pages.

Donation Cause Sidebar:

Donation Cause Sidebar will works for campaign archive pages, all campaign pages.

Events Sidebar:

Events Sidebar will works for event pages.

Footer widgets:

Footer widgets will be shown on theme footer area. You can manage the footer widgets column from the theme option.

WooCommerce Shop:

This sidebar area will be shown if you install and active the WooCommerce plugin. It will works for the shop page and product archive pages.

WooCommerce Product:

This sidebar area will be shown if you install and active the WooCommerce plugin. It will works for the product detail page.

 
 

 

Charitable plugin comes with login registration shortcodes. If you import the demo data you should have those pages.

Or you can create the pages using the visual composer elements.

 

 

You can add login registration or any other page links conditionally in the header top bar form the theme options. Go to Theme Options > Pre Header Settings.

 
 

 

Go to admin area > Sliders > Add new slider. Here you can add new slide title, content, image etc.

Then you can use Visual Composer slider element to show the slider.

 

 

 

How to add a donation campaign

This theme comes with full support of Charitable donation plugin. You can create donation campaign and rise donation using this plugin.

For full documentation of Charitable donation plugin go to the following link

https://www.wpcharitable.com/documentation/