TwoGether WordPress Theme Documentation

Introduction

Thank you for Purchasing our TwoGether WordPress Theme. We are very glad that you have chosen our TwoGether WordPress Theme for your website.

TwoGether Wedding Theme is a clean, super flexible and fully responsive WordPress Theme, suited for love, engagements and wedding websites.

This document written very carefully by keeping mind set that it should be easy to understand for Beginner to Advance user or developers. We have divided this document in 3 main section.

1) Getting Started : This section will very help full for Quick start and to understand how to setup theme.
2) Detailed Document : This section explains everything about Theme with every setting.
3) Other : This section provides information about miscellaneous items like theme features etc.

If you have any query that is beyond the scope of document, please feel free to contact us at support@solwininfotech.com

TwoGether Wedding WordPress Theme
We offer theme customization. Get in touch for a quote.
Quick Search Tip: Access your browser search with keyboard shortcut "Crtl+F" (Windows) or "CD+F" (OSX) for instant results.

Installation

To install this theme, you must have a working version of WordPress already installed. For information regarding to install the WordPress platform, please see the WordPress Codex  https://codex.wordpress.org/Installing_WordPress

1. Installation Via WordPress Admin Area

  1. Step 1. Log into your WordPress admin area.
  2. Step 2. Go to Dashboard » Appearance » Themes.
  3. Step 3. Click on Add New Theme button at top.
  4. Add New Theme
  5. Step 4. Now, Click on Upload Theme button at top and upload twogether.zip which you have downloaded from your Member Area at Solwin Infotech website.
  6. Step 5. Click on Activate once upload has finished.
Upload Zip
Activate Theme

2. Installation Using FTP

  1. Step 1. Download twogether.zip file from your Member Area at Solwin Infotech website.
  2. Step 2. Extract Zip file.
  3. Step 3. Using your FTP program, upload the non-zipped theme folder into the "/wp-content/themes/" folder on your server.
  4. Step 4. Go to Dashboard » Appearance » Themes and find TwoGether theme from list.
  5. Step 5. Click on Activate to active TwoGether theme.
Active Theme

Install & Active the Plugins

After the TwoGether theme is activated, a notification occurs on the top that will suggest which plugins are required in theme.

Activation Message

Click on Begin installing plugins for plugin installation OR Click on Begin activating plugins if plugins are already installed.


Required Plugins:

  • Contact Form 7: Manage multiple contact forms, plus you can customize the form and the mail contents flexibly with simple markup.

Recommended Plugin:

  • Avartan Slider: A Responsive WordPress slider that allows you to create unlimited layers with text, image and video elements.

System Status Info

Note : Set "Max execution time" to at least "3600" and set "Max input vars" to "1500".

Above configuration will helps you to run the auto install successfully.

System Information

Auto Install Sample Data

Note: In order to import data successfully check that all required plugins are installed and activated.

Sample data provide the dummy content. By importing this data your site will look like the demo website.

To Auto Install Sample Data:

  1. Step 1. Go to your Dashboard » Twogether » Install Demos.
  2. Step 2. Select Demo Home Page Layout.
  3. Step 3. Click on "Install Sample Data" Button to start Auto Install process.
One Click Install
Remove Sample Data

Remove the installed dummy content from your website.

To Remove Sample Data:

  1. Step 1. Go to your Dashboard » Twogether » Install Demos.
  2. Step 2. Click on "Uninstall Sample Data" Button to remove dummy content.
Remove Sample Data
Not Recommended: Do this action if you really want to remove installed sample data and want to start again from scratch.

Setting Up Home Page

This section will help you to arrange home page and other pages of your site. This will also guide to you as how to setup WordPress Menus, Create a Slider/Banner, Create Home Page, Use of Page Templates and insertion of shortcode in pages.

Home Page View
  1. Step 1: Go to Dashboard » Pages » Add New, enter page name and select template as Home Page Template for Page Attribute as shown in below image
  2. Step 2: Now, click on Add Shortcodes button and that will give you list of shortcodes
  3. Step 3: Select Home Page Banner shortcode to display slider in home page
  4. Home Page Setting
  5. Step 4: Publish this page
  6. Step 5: Go to Dashboard » Settings » Reading, select home page as a front page
  7. Front Page Home

Create Slider

  1. Step 1. Go to Dashboard » Avartan Slider

  2. Step 2. Click on

    Create new slider

  3. Step 3. Add the slider name. Shortcode of the slider will be generated automatically (see image below).

    Save Settings

  4. Step 4. Click on create slide button to save your slider.

  5. Step 5. Next to that, Click on Edit slides at top of page for edit your slide details.

  6. Step 6. To add new slide click on Add slide button at right side of the slide list and add new Layer from Add New Layer

    create slide

  7. Step 7. In order to add Avartan Slider on any page, navigate to Pages » Add New

  8. Step 8. Click on add-avartan-slider-btn

    Add Avartan Slider

  9. Step 9. Select slider and click on Insert Avartan Slider button

    Select Slider

  10. Avartan Slider shortcode added successfully. Now save the page and enjoy the slider.

    slider added

Building the Menu

  1. Step 1. Go to Dashboard » Appearance » Menus.
  2. Step 2. Click on create a new menu as show in below image.
  3. Step 3. Enter menu name and click on Create Menu as shown in below image.
  4. Create a Menu
  5. Step 4. Select Pages like Latest Blog, Party, RSVP, We, Our Story from left Side and click on Add to Menu button as show in below image
  6. Step 5. After selecting pages select menu location and click on save menu.
  7. Final Step in Menu
  8. Primary Menu Front Preview Final Step in Menu

Note : The menu must be available and selected as "Primary Menu" under Theme locations to display a proper home page like demos with TwoGether theme setup.

Create Mega Menu

Mega menu can create with Auto or Fixed width size. It will manage automatically according to number of columns. There are other options as like Navigation label which manage to show or hide navigation label, Sub label used to represent Trending Feature with custom color.

Mega Menu Backend

Megamenu Creation

Mega Menu Front

Megamenu Front

Setting Up One Page Theme

Why and When to Use One page theme..?

Single page theme that displays all the essential features of your Website on the Home page. It makes easy for the users to scratch all the required information within a single page from whole site and represent it via Home page.

  1. Step 1. Go to Dashboard » Appearance » Menus.
  2. Step 2. Click on Create a new menu as shown in below image.
  3. Step 3. Enter menu name and click on Create Menu.
  4. Step 4. Click on Custom Links, enter section id in 'URL' and enter menu title in 'link text' from left side, then click on Add to Menu button as shown in below image
  5. Step 5. After selecting pages select menu location and click on Save Menu.
  6. Final Step in Menu

List down of widget name and id as shown below.

Widget Name Section Id for menus
Wedding Couple : #wedding_couple-2
Wedding Timer : #wedding_timer-2
Our Story : #our_story-2
Our Gallery : #ourgallery-2
Wedding Program : #wedding_program-2
Important People : #important_people-2
Wedding RSVP : #wedding_rsvp-2
Our Latest Blogs : #blog_post-2

Setting up Page Template

How to select page template:

Select a page template from Page Attributes as shown in below image.

Page Template

There are following page templates:

  • Contact Us Page Template: This page template is used to display contact us page content.
  • Full width page template: This template is used to display content as a full width page, no sidebar.
  • Home page template: This page template is used to display home page content.
  • Left sidebar page template: This template is used to display sidebar as a left side sidebar in a page.

Contact Information Widget

This widget will be used to display your contact information like postal address, phone number, fax and contact email.

Admin Preview

Conact us

Front End Preview

Contact us

Facebook Like Widget

This widget will be used to display your Facebook Page.

Admin Preview

Facebook Like

Front End Preview

Facebook Like

Flickr Photos Widget

This widget will be used to display your Flickr photos from your flickr account.

Admin Preview

Flickr Photos

Front End Preview

Flickr Photos

Important People Widget

This widget will be used to display all the important people list.

Admin Preview

Important People

Front End Preview

Important People

Latest Post Widget

This widget will be used to display the latest post of blog.

Admin Preview

Latest Post

Front End Preview

Latest Post

Social Share Widget

This widget will be used to display the Social share icon.

Admin Preview

Social Share

Front End Preview

Social Share

Wedding Couple Widget

This widget will be used to display the wedding couple image.

Admin Preview

Wedding Couple

Front End Preview

Wedding Couple

Wedding Timer Widget

This widget will be used to display the wedding timer.

Admin Preview

Wedding Couple

Front End Preview

Wedding Couple

Our Story Widget

This widget will be used to display the our story section.

Admin Preview

Our Story

Front End Preview

Our Story

Wedding Program Widget

This widget will be used to display the wedding program section.

Admin Preview

Our Story

Front End Preview

Our Story

RSVP Widget

This widget will be used to display the RSVP section.

Admin Preview

Our Story

Front End Preview

Our Story

Twitter Widget

This widget will be used to display the twitter feeds.

Admin Preview

Twitter

Front End Preview

Twitter

Instagram Widget

This widget will be used to display the instagram feeds.

Admin Preview

Instagram

Front End Preview

Instagram

Create Custom Widget Area

  1. Step 1. Go to Dashboard » Appearance » Widgets

    Create Custom Widget Area

  2. Step 2. Enter Name of new widget area. Click on "Add Widget Area".

    Widget Area

  3. Step 3. After Custom Widget Area created, Drag and Drop the widgets in Custom Widget Area.

    Custom Widget Area

  4. Step 4. Custom Widget Area looks like this.

    Custom Sidebar Area

  5. Step 5. To delete Custom Widget Area click on - icon.

Custom Header Option

Custom Header Option

Custom header option manages individual Header background for Pages and Posts. It provides below 3 options to manage it:

  • Default: It manages the common header, which is set in Theme option panel as Default for all pages and posts.
  • Background Image: It provides upload image option for particular single page as header background with Overlay color.
  • No Background: It manages no such header background from default theme option as well.

Custom Sidebar Option

Custom Sidebar Option

Manage Custom Sidebars with different Page templates, you can create it in Widget panel and manage it with different Pages.

Note: Custom Sidebar will not work for Full Width Template & Home page Template.

Add Wedding Program

Add Wedding Program

Add Our Story

Add Our Story

Add Girl

Add Girl

Add Boy

Add Boy

Add Shortcode in Page

  1. Step 1. Log into your WordPress admin area.
  2. Step 2. Go to Dashboard » Pages » Add New.
  3. Step 3. Click on Add Shortcodes (as show in below left image).
  4. Step 4. Now, select the shortcode from list (as show in below right image).
Add Shortcode Button
Add Shortcode in Page

Headers Shortcodes

These shortcodes will be used for displaying h1, h2, h3, h4, h5, h6 tags.

H1 Tag :

[sol_header type='h1' title='demo content' margin_top='5px' margin_bottom='5px']

<h1 style='margin-top:5px;margin-bottom:5px'>demo content</h1>

H2 Tag :

[sol_header type='h2' title='demo content' margin_top='5px' margin_bottom='5px']

<h2 style='margin-top:5px;margin-bottom:5px'>demo content</h2>

H3 Tag :

[sol_header type='h3' title='demo content' margin_top='5px' margin_bottom='5px']

<h3 style='margin-top:5px;margin-bottom:5px'>demo content</h3>

H4 Tag :

[sol_header type='h4' title='demo content' margin_top='5px' margin_bottom='5px']

<h4 style='margin-top:5px;margin-bottom:5px'>demo content</h4>

H5 Tag :

[sol_header type='h5' title='demo content' margin_top='5px' margin_bottom='5px']

<h5 style='margin-top:5px;margin-bottom:5px'>demo content</h5>

H6 Tag :

[sol_header type='h6' title='demo content' margin_top='5px' margin_bottom='5px']

<h6 style='margin-top:5px;margin-bottom:5px'>demo content</h6>

Dividers Shortcodes

This shortcode will be used to add a divider in content.

Solid Line Divider :

[sol_divider type='solid']
Dotted Line Divider :

[sol_divider type='dotted']
Dashed Line Divider :

[sol_divider type='dashed]
Double Line Divider :

[sol_divider type='double']

Spacer Shortcode

This shortcode will be used to put a horizontal space of a given pixel.

[sol_spacer size='30px']

Map Shortcodes

This shortcode will be used to display maps in content or contact us page.

1. Roadmap type :

[sol_map type='ROADMAP' address='America' width='500px' height='350px' zoom='5' map_icon='icon path']

Roadmap

2. Satellite type :

[sol_map type='SATELLITE' address='America' width='500px' height='350px' zoom='5' map_icon='icon path']

Satellite

3. Hybrid type :

[sol_map type='HYBRID' address='America' width='500px' height='350px' zoom='5' map_icon='icon path']

Hybrid

4. Terrain type :

[sol_map type='TERRAIN' address='America' width='500px' height='350px' zoom='5' map_icon='icon path']

Terrain

Progress bar & Pie chart

This shortcode will be used to display progress bar and pie chart

Progress bar :

[sol_progressbar value='50' title_position='in' margin_top='5px' margin_bottom='5px' style='1|2|3']add title here[/sol_progressbar]

Progressbar

Pie chart :

[sol_piechart value='80' show_percent='n' margin_top='0' margin_bottom='0' title='WordPress' style='1' thickness='0.3' width='250']add content here[/sol_piechart]

Piechart

Accordion and Toggles

This shortcode will be used to display accordion & toggle.

Accordion :

[sol_accordians style='1|2|3'][sol_accordian title='add title here']add content here[/sol_accordian][sol_accordian title='add title here']add content here[/sol_accordian][sol_accordian title='add title here']add content here[/sol_accordian][/sol_accordians]

Accordion

Toggles :

[sol_toggles style='1|2|3'][sol_toggle title='add title here']add content here[/sol_toggle][sol_toggle title='add title here']add content here[/sol_toggle][sol_toggle title='add title here']add content here[/sol_toggle][/sol_toggles]

Toggles

Tabs :

[sol_tabs type='vertical|horizontal' style='1|2'][sol_tab title='add title here']add content here[/sol_tab][so_ltab title='add title here']add content here[/sol_tab][sol_tab title='add title here']add content here[/sol_tab][/sol_tabs]

Toggles

Message Box

This shortcode will be used to display messages like success, danger, warning, info, etc.

Success Message Box :

[sol_messagebox type='success'] Well done! You successfully read this important alert message. [/sol_messagebox]

Success Message Box

Danger Message Box :

[sol_messagebox type='danger'] Oh snap! Change a few things up and try submitting again. [/sol_messagebox]

Danger Message Box

Warning Message Box :

[sol_messagebox type='warning'] Warning! Better check yourself, you're not looking too good. [/sol_messagebox]

Warning Message Box

Info Message Box :

[sol_messagebox type='info'] Heads up! This alert needs your attention, but it's not super important. [/sol_messagebox]

Info Message Box

Share & Follow Icons

This shortcode will be used to display share and follow icons

Share Icons :

[sol_shareicon size='small|large' shape='circle|square']

Share Icons

Follow Icons :

[sol_followicon size='small|large' shape='square|circle' facebook="https://www.facebook.com/" twitter="https://twitter.com/" pinterest="https://in.pinterest.com/" googleplus="https://plus.google.com/" rss="https://www.rss.com/" instagram="https://instagram.com/" linkedin="https://in.linkedin.com/" youtube="https://www.youtube.com/"]

Follow Icons

Pricing Table

This shortcode will be used to display pricing table.

[sol_pricingtable columns='3|4' collapsed='y|n'][sol_pricingcolumn heighlight='y|n' title='Premium' price='$50' time_period = 'per year' btn_link='#' btn_txt='Buy Now']add content here[/sol_pricingcolumn][/sol_pricingtable]

Pricing Table

Sitemap

This shortcode will be used to display Sitemap.

[sol_sitemap site_pages='yes' site_archive='yes' site_post='yes']

Sitemap

Countdown

This shortcode will be used to display the Timer with Countdown timings.

[twogether_pro_timer timer_date='2017-11-18 11:27:48' timer_title='' timer_sub_title='Text Square Design' timer_layout='text_square' timer_text_color='#fff' timer_background_color='#000' timer_background_opacity='0.8']

Countdown Square

[twogether_pro_timer timer_date='2017-11-18 11:27:48' timer_title='' timer_sub_title='Text Round Design' timer_text_color='#fff' timer_background_color='#000' timer_background_opacity='0.8']

Countdown Round

[twogether_pro_timer timer_date='2017-11-18 11:27:48' timer_title='' timer_sub_title='Text Word Square Design' timer_layout='word_square' timer_background_color='#ff0000' timer_text_color='#fff' timer_background_opacity='0.8']

Countdown Word Square

Add Sidebar

This shortcode will be used to display sidebar in content area.

[sol_sidebar id='our-story-content']

Sidebar

General Settings

General Settings

Design Settings

Design Settings

Header Settings

Header Settings

Blog & Archive Page Settings

Blog & Archive Page Settings

Single Blog Page Settings

Single Blog Page Settings

Contact Us Settings

Contact Us Settings

WooCommerce Product Page Settings

Product Page Settings

WooCommerce Single Product Page Settings

Single Product Page Settings

Import/Export Settings

Import/Export Settings

Theme features

The theme comes with tons of features that you can control easily via our user-friendly theme admin panel. You can find these features below:

  • Fully Responsive: Running on the any browser, sharp images
  • One page and Multi page WordPress Theme
  • Home Page Banner with Avartan Slider Pro Plugin
  • Google map for your wedding place
  • Bridemaids and Groomsmen section
  • Cross Browser Compatibility
  • Latest Bootstrap & Font Awesome version Support
  • RSVP Form Support
  • Fully Animated Home Page
  • Built with Less .css
  • Theme Option panel
  • Custom Widget Areas
  • Custom Header, Footer and Sidebar Options
  • Unlimited Colors
  • Custom Preloader
  • Google font Support
  • Endless Layout possibilities
  • Customizable Mega Menu
  • Wedding Gallery
  • Wedding Story
  • Post formats
  • Enable/Disable Sticky Navigation
  • Marriage Countdown Timer
  • Wide variety of option panel to give beauty your site
  • Translation Ready (.pot files)
  • Wedding Gallery Photos Presentations
  • Pre-made Demos
  • Easy Social Share buttons
  • Compatible with FontAwesome
  • RTL Supported
  • SEO Optimized
  • Custom CSS support
  • Compatible with latest update

FAQ

1. Does this theme support any plugins?

Twogether Pro supports Avartan Slider, Blog Designer PRO, Contact Form 7, WP Super Cache,Yoast SEO, WooCommerce, WC Checkout Fields Editor plugin Support.


2. For which purposes I can use your theme?

TwoGether WordPress Theme is suitable for love, engagements and wedding websites.

Translation

TwoGether theme is language compatible, thus can be translated into multiple languages. You can use POEdit plugin for translation.

  1. Step 1. Find the .pot file in /wp-content/themes/twogether/languages/

    .pot file
  2. Step 2. Select language from admin side, Go to Dashboard » Settings » General in that check Site Language options.

    Select language
  3. Step 3. Check language prefix in front end, view HTML.

    Language prefix
  4. Step 4. Open the .pot file with POEdit and translate the texts into your preferred language.

    translate texts
  5. Step 5. Now you will get two separate files – a .po file and a .mo file.

    Note : When you save the files, you must name them according to your language code. Find a list of language codes at WordPress in your Language. For example, the language code for English is en_EN, so you would save the translated files as en_EN.po and en_EN.mo.

  6. Step 6. Now Paste that two .po & .mo files in /wp-content/themes/twogether/languages/ and rename to eg( en_CA.mo & en_CA.po ).

    .po and .mo files
For more about translating WordPress themes please visit the following link : https://developer.wordpress.org/themes/functionality/localization/

Update Theme

How to upgrade theme? Follow the below steps and upgrade your theme.

  1. Step 1 : Login with your WordPress admin area.
  2. Step 2 : Go to Dashboard » Twogether » Upgrade.
  3. Step 3 : Check your installed theme version and latest available version.
    upgrade theme
  4. Step 4 : If you already installed the latest version, then ignore the following steps otherwise go through to the following steps.
  5. Step 5 : Go to solwininfotech.com
  6. Step 6 : Login with your username and password (If you are not logged in) OR Register
  7. Step 7 : Buy TwoGether theme (If you haven't purchased a theme)
  8. Step 8 : Go to My account
  9. Step 9 : Click on "Payment History" tab
  10. Step 10 : View your order
  11. Step 11 : Download twogether.zip file

Note: Please note that with the theme update any code modifications done in the theme's code will be lost, so please make sure you have a backup copy of the theme files before you update the a theme.

Now installing an update:

  1. 1. Update Using FTP

    1. Step 1. Download twogether.zip file from your Member Area at Solwin Infotech website.
    2. Step 2. Extract Zip file.
    3. Step 3. Using your FTP program, upload the non-zipped theme folder into the "/wp-content/themes/" folder on your server.
    4. Step 4. Go to Dashboard » Appearance » Themes and find TwoGether theme from list.
    5. Step 5. Click on Activate to active TwoGether theme.
    Active Theme

After activating theme, you will see notification of 'Run The Updater'. Hit on the button 'Run The Updater'. Your theme content from free version of TwoGether theme will be added in new theme and Your theme will look beautiful.

Run Updater

Note: Please note that some of your data that is not required in new theme will be deleted. So Keep your site backup with database before upgrading a theme.

Note: Please note that with the activating of the new theme it is possible your menu setting not to be saved for the new theme. If so, you just have to go to Appearance » Menus » Theme Locations, select the menu (it will be still there) and press the "Save" button.

Thanks for Purchasing TwoGether Theme!

We would like to thank you for purchasing our TwoGether Theme! If you have any difficulties with TwoGether Themes or need any additional service, do not hesitate to contact us. We provide priority support with our all premium WordPress themes and plugins.

Just contact us on support.solwininfotech.com

We are very happy to assist you!