Thank you for choosing Blossom Fashion Pro theme!

We hope you enjoy this feminine and chic WordPress blog theme, which we designed especially for you to create lively and eye-catching fashion blogs.

Our team created it with a lot of hard work and love. And we want your website to blossom with Blossom Fashion.

About This Theme Documentation:

This documentation covers the installation, the usage, and the different settings available in the customizer of the theme.

The main goal of the documentation is to provide you the guidance and walk-through to set up the theme on your website in an easy-to-follow manner, while also introducing you to some of the features of the theme. So, we encourage you to go through this document and keep it handy for reference.

If you have any questions about the theme or need any kind of assistance with anything related to the theme, please feel free open a support ticket. Our support team will be happy to assist you.

In this documentation, first, we’ll make sure that everything is ready for the installation, then we’ll set up the theme, and cover some initial configuration and customization options.

How to use this Documentation?

We recommend you to go through each step of the documentation to have a better understanding of the theme and its features.

However, if you are looking for a specific section, you can easily navigate using our table of contents given below.

If you want to find a specific keyword, hit “Ctrl+F” on your browser to start searching.

Requirements for Getting Started

Make sure Blossom Fashion Pro is compatible to your WordPress version.

Blossom Fashion Pro will work with 4.7 and above versions of WordPress.

However, for best experience, added features, and updated security patches, we recommend you to update your WordPress to the latest version.

If you haven’t downloaded WordPress already, you can download it from the WordPress repository via https://wordpress.org/download/

Checklist for Getting Started:

  • Check WordPress Version and Update it.
  • Install and Activate Blossom Fashion theme.
  • Install Necessary Plugins. Some functionality of the theme might not work if you do not install the recommended plugins.

Recommended Image Size (in px)

Slider Layout 1: 1920 X 650

Slider Layout 2 Larger Image: 920 x 650

Slider Layout 2 Smaller Images: 460 x 310

Slider Layout 4: 500 x 650

Post Page Featured Image without Sidebar: 1410 x 600

Post Page Featured Image with Sidebar: 1020 x 600

Post Page Featured Image Full Width: 1920 x 450

Archive Page Listing: 435 x 435

Home Page section: 480 x 300

Related Posts: 320 x 200

How to Check and Update the WordPress version:

  • Log in to the WordPress admin panel.
  • Go to Dashboard >Updates and update the theme if there is any update available.

How to Install and Activate Blossom Fashion Theme

After you have the latest version of WordPress, save the downloaded Blossom Fashion Pro theme file (blossom-Fashion-pro.zip) somewhere handy on your computer, as you will be using the included files for the rest of the installation process.

The Blossom Fashion Pro theme file includes:

A WordPress Theme Files (in .zip format) — This (blossom-fashion-pro.zip) is a compressed WordPress theme file containing all of the required templates, images, and icons required for the theme to function properly.

Note for Safari users (macOS): If you are using Safari to download the theme file, the file may unzip automatically. So, make sure your theme file is in .zip format. Here’s how to stop Safari from automatically unzipping your .zip file.

(GIF of installing the new theme is required here)

Now, to install and activate the theme follow these steps or the above gif:

  • Log in to WordPress Dashboard.
  • Go to Appearance > Themes.
  • Click on Add New button.

  • Click on Upload Theme.

  • Click on “Browse…”, select the “blossom-Fashion-pro.zip” file from your computer and click Open.
  • Click Install Now.

  • After the theme is installed, click on Activate to use the theme on your website.

Installing Recommended Plugins

You must install and activate the following plugins to get the best out of Blossom Fashion Pro theme.

BlossomThemes Email Newsletter by Blossom Themes: This plugin is needed to add newsletter subscription form on the newsletter section. The plugin also creates a newsletter widget that can be used in the sidebars.

BlossomThemes Instagram Feed by Blossom Themes: This plugin lets you add an Instagram feed to your website. The plugin also generates Instagram shortcode that you can add in your posts and Instagram widget that you can add in the sidebars.

BlossomThemes Toolkit by Blossom Themes: This plugin generates 12 very useful widgets for you to use. It creates widgets like popular posts, advertisement box, author bio, social media feed, etc.

Regenerate Thumbnails by Alex Mills (Viper007Bond): If you have existing content, this will help you update your images thumbnail sizes. To update the thumbnails, you must run this plugin.

How to Install Recommended Plugin:

  • Go to Appearance> Install Plugins

  • Click “Install” to install the plugins.

  • Click “Activate” to activate the plugins.

How to Setup the Front/Landing/Home Page

To get started with customizing the theme, you first may need to set up a front page. To make the theme look like the demo, you need to select the homepage display as the latest posts. The latest posts are selected by default when you first install the WordPress. But, if you are using the theme on an existing WordPress installation, make sure your front page is set as latest posts.

  • Log in to WordPress Admin Panel.
  • Go to Appearance>Customize > Homepage Settings
  • Select Your latest posts under Your homepage displays.
  • Click Publish.

How to Add/Edit a Logo and Favicon (Site Icon)

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > Site Identity
  • Click Select Logo and upload your logo.
  • Enter Site Title and Tagline.
  • Check Display Site Title and Tagline if you want to show your website’s name and tagline.
  • Click Select Image and upload Image for Site Icon (favicon).
  • Select the font, font style, and font size for the site title and tagline.
  • Click Publish.

Theme Panel

Site Identity

This option helps you add logo, title, tagline, and site icon (favicon) on your website. Refer to How to add/edit a Logo and Favicon (Site Icon) section of this documentation.

Colors (Change Color of the Theme)

  • You can change the primary, background, button, header, and footer color of the theme from here.
  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > Colors
  • Click on “Select Color” and pick a color to change the primary, background, button, header, and footer color respectively.
  • Click Publish when you are satisfied.

Background

You can change the background image and background style (image or pattern) from this panel.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > Background
  • Click on “Image” tab.

  • Click on “Select image” button to add the background image.
  • Click on “Remove” to remove the image. Click on “Change image” to change the background image.
  • Click Publish when you are satisfied.

Or, you can also choose your background as pattern. To do this,

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > Background
  • Click on “Pattern” tab.

  • Select the pattern you like.
  • Click on “No bg” pattern to remove the pattern.
  • Click Publish when you are satisfied.

Layout Settings

You can change the style and layout of your theme from here. You can choose from 8 Header layouts, 7 Slider layouts, 21 Home Page layouts, 21 Archive Page layouts, and 5 Single Post Page layouts. You can also choose from 4 different pagination styles.

Header Layouts (Choose from 8 styles)

  • Go to Appearance > Customize > Layout Settings > Header Layout
  • Choose the layout you like the most.
  • Click Publish.

Slider Layouts (Choose from 7 styles)

  • Go to Appearance > Customize > Layout Settings > Slider Layout
  • Choose the style you want to use on the slider.
  • Click Publish.

Home Page Layout (Choose from 21 styles)

  • Go to Appearance > Customize > Layout Settings > Home Page Layout
  • Choose the style you want to use for the home page. The home page layout starts after featured area.
  • Click Publish.

Archive Page Layout (Choose from 21 styles)

  • Go to Appearance > Customize > Layout Settings > Archive Page Layout
  • Choose the style you want to use for the archive page.
  • Click Publish.

Single Post Layouts (Choose from 5 styles)

  • Go to Appearance > Customize > Layout Settings > Single Post Layout
  • Choose the style you want to use on the post page. If you are not using the right sidebar on the posts, the style will adapt accordingly.
  • Click Publish.

Pagination Settings – Auto Infinite Scroll and more

  • Go to Appearance > Customize > Layout Settings > Pagination Settings
  • Choose the pagination style for posts. You can use numbers, next/previous, load more button, or auto infinite scroll.
  • Click Publish.

Typography

You can change the fonts of your contents and Header tags here.

  • Log in to your WordPress Dashboard.
  • Go to Appearance> Customize> Typography
  • Select the content type to change its typography.
  • Configure Font family, Style, and Size.
  • Click Publish.

General Settings

From this panel, you can add/edit notification bar, sliders, featured area, social media settings, SEO settings, Single Posts Page and Pages settings, Newsletter Settings, Instagram Settings, and other misc settings.

Banner/Slider/Video Section

You can choose a static image, video, or a slider as your banner. The banner will be displayed at the top of your website.

To set up your banner:

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Banner Section
  • Choose either Banner as Slider, Static/Video Banner, or Disable Banner (if you do not want banner at all).

If you choose Banner as Slider:

  • Select either Latest Posts, Category, Pages, or Custom to be displayed in your Banner section.
  • Enter the Number of Slides that you want to display.
  • Choose if you want to enable auto transition, loop, and caption for the slide. Blue is enabled.
  • Choose your favorite style of Slider Animation.
  • Click Publish when done.

If you choose Static/Video Banner:

  • Click on Select Video to upload the video of your choice to the banner section.
  • Or, you can also enter a YouTube URL of the video you want to keep.
  • If you want to display a static image, click on Add new image to upload the desired picture as the banner image.

Featured Area Settings

You can select content for the featured area here. You can show upto 3 pages or 3 custom content in the featured area.

Featured Area using Page

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Featured Area Settings
  • Enable Featured Area. Blue is enabled.
  • Choose “Page” tab.
  • Select the pages for the featured area.
  • Click Publish.

Featured Area using Custom Content

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Featured Area Settings
  • Enable Featured Area. Blue is enabled.
  • Choose “Custom” tab.
  • Click on “Add new featured content” to add a content. Click “Remove” to remove a content.
  • Upload image and enter title, subtitle, and link for the featured content.
  • Click on “Add new featured content” to add more content. You can add up to three content.
  • Click Publish.

Social Media Settings

You can add social media links and enable/disable social media on the header from here.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Social Media Settings
  • Enable Social Links. Blue is enabled. When you enable the social links, social media icons will be displayed in the header.

  • Click “Add new links” button to add a social media icon.
  • Enter the icon and link for the social media. Click on a link to edit it. Click on “Remove” to remove a social icon.
  • Click Publish.

Social Sharing

You can add social sharing buttons on the post page and archive page. You can add Facebook, Twitter, Pinterest, Google Plus, LinkedIn, Email, StumbleUpon, and Reddit.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Social Sharing
  • Enable Social Sharing Buttons. Blue is enabled.
  • Click on the eye icon at the beginning of a social network to enable or disable it.
  • Drag the social media up or down to arrange them.
  • Click Publish.

SEO Settings

You can enhance your website’s SEO from here. You can enable last update date on single post page here. You can also enable/disable breadcrumb in this panel.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > SEO Settings
  • Enable Last Update Post Date to boost your SEO. Blue is enabled. When you enable this, Google can read the post updated date and index your latest content.
  • Enable Breadcrumb. Blue is enabled. Breadcrumb helps in better navigation for search engines and users.
  • Enter the Home Text for Breadcrumb.
  • Click Publish.

Post (Blog) & Pages Settings

You can manage single post page settings like excerpt, related posts, popular posts, etc.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Posts (Blog) & Pages Settings
  • Select the default layout for pages and posts.
  • Enable Blog Excerpt if you want to show summary of the posts. Blue is enabled. If enabled, select the number of words for the blog excerpt and read more label.
  • Enable Show Related Posts. Related Posts will be shown below the blog post.
  • Enter the label for “Read More Text”.
  • Enable “Hide Prefix in Archive Page” if you want to hide the prefix “Category:” from the category archive page.
  • Enter the label for “Single Header” that appears in the header of single post layout one.
  • Enter the title for the affiliate widget in single page.
  • Enable “Hide Author” if you don’t want to show author section on the blog page.
  • Enter the title for the Author Section.
  • Enable Show Related Posts if you want to display the most relevant posts in single page.
  • Enter the title for related posts.
  • Select the taxonomy for related posts. If you choose category, the posts of the same category as the post will be displayed as related posts. If you select tags, the posts associated with the same tags as the post will be displayed as related posts.
  • Enable Show Popular Posts if you want to display the popular posts below a post. 6 posts with the most number of comments will be displayed.
  • Enter the title for Popular Posts.
  • Enable or Disable displaying of the comments.
  • Enable Hide Category if you don’t want to show the category name on blog posts.
  • Enable Hide Posted Date if you don’t want show posted date on blog posts.
  • Enable Show Featured Image to show featured image on the blog posts.
  • Click Publish.

Newsletter Settings

You need to have BlossomThemes Email Newsletter plugin installed and activated for this setting.

You can add subscription form on the newsletter section of your website from here. To add a newsletter, you need to create a newsletter first and copy & paste the newsletter shortcode.

Creating Newsletters

  • Log in to WordPress Admin Panel.
  • Go to BlossomThemes Email Newsletter > Add New

  • Enter the title for the newsletter.
  • Select the options on the Field Settings. Select “Name and Email” if you want users to enter their Name and Email to subscribe to your newsletters, otherwise select “Email”.
  • Enter Name and Email placeholder.
  • Enter the label for Submit button.
  • Enter Form note. The note will be displayed below the Title.

  • From the Appearance Settings, edit the appearance of the newsletter form.
  • Click on Publish to create the newsletter.

Configuring Newsletters

  • Log in to WordPress Admin Panel.
  • Go to BlossomThemes Email Newsletter > Settings
  • Select the email platform – Mailchimp, Mailerlite, or ConvertKit.
  • Enter the API key of the email platform.
  • Select whether to display Popup text of Page when a visitor subscribes to your newsletter. If you select popup text, enter message. If you select page, select the page you want to show.
  • Click Save Changes.

Adding Newsletter on the Newsletter section

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Newsletter Settings
  • Enable Newsletter Section. Blue is enabled.
  • Enter the shortcode of the newsletter form you want to show. You can find the shortcode on the left hand side of the newsletter.

  • Click Publish.

Instagram Settings

You can add your Instagram feed on your website from here.

To display your Instagram feed, you need to install and activate BlossomThemes Instagram Feed plugin and then, configure your Instagram profile.

Configuring Instagram Profile

  • Log in to WordPress Admin Panel.
  • Go to BlossomThemes Instagram Feed > General

  • Enter your Instagram username.
  • Enter the number of photos you want to display from your Instagram feed.
  • Enter the number of photos you want to display at a time in Number of Photos Per Row.
  • Enter the Instagram Profile link text.
  • Check “Show Likes/Comment” if you want to show likes and comment count of your Instagram profile on your website.
  • Click Save Changes.

Adding Instagram Section

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Instagram Settings
  • Enable Instagram Section. Blue is enabled.
  • Click Publish.

Misc Settings

You can enable/disable admin bar, lightbox for photos, header search, sticky header, and last widget sticky here.

  • Log in to WordPress Admin Panel.
  • Go to Appearance > Customize > General Settings > Misc Settings
  • Enable/Disable Admin Bar.
  • Enable Lightbox if you want to show larger version of images when users click on a image on your website.
  • Enable Header Search if you want to show search form on the header.
  • Enable Sticky Header if you want to make your navigation menu sticky. The navigation menu will float with the content if you enable sticky header.
  • Enable Last Widget Sticky if you want to float the last widget of the sidebar with the content.
  • Enable Drop Cap if you want to show the first letter of the first word in the post/page content in drop cap.
  • Enter the label for the header of the author archive page.
  • Enter the label for the header of the search page.
  • Enter the label of the affiliate widget in archive pages.
  • Select the preferred layout for the search page sidebar.
  • Click Publish.

Shop Settings

You can customize shopping sections on your page from this panel. You can place your shopping cart on the header, place your shopping section, select background for shopping section, choose different labels, manage WooCommerce or Affiliate Code, and choose your product category.

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize> General Settings > Shop Settings
  • Enable ‘Shopping Cart’ if you want to show shopping cart in the header. Blue is enabled.
  • Enable ‘Shop Section’ if you want to show Shop Section below Featured Section on your page.
  • Choose your preferred background for the shop section.
  • Enter a title for your shop section.
  • Enter a text message if you want for the Shop Section.
  • Choose the number of products you want to be displayed in the Shop Section.
  • Enable “Bottom Shop Section” if you want to show Shop Section below the blog posts as well.
  • Enter the title for the Shop Section at the bottom of the blog posts.
  • Select either “WooCommerce” or “Affiliate Code” tab to display in the bottom shop section.

  • Choose the “Affiliate Code” tab if you have an affiliate link. Paste the affiliate code in the section provided.

Contact Page Settings

You can set up and manage your contact page from this panel.

Contact Form Settings

To create a form for your visitors to contact you:

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize > Contact Page Settings > Contact Form Settings
  • Enter the label for the title of the contact page.
  • Enter the text message that you want to give for the contact page.
  • To place the contact form on the page, click on ‘Contact Form 7’.

  • Install and activate the required ‘Contact Form 7’ plugin.

Google Map Settings

You can place a Google Map on your blog from this panel. The theme allows you to control whether or not you want a scrolling wheel, map controls, map marker, API Key. You can also set latitude and longitude for your location and select the level of zoom.

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize > Contact Page Settings > Google Map Settings
  • Enable Google Map to turn the map on. Blue is enabled.
  • Enable or Disable the scrolling functionality for zooming the map.
  • Enable Map Controls to display the the controlling icons appearing above the map.
  • Enable Map Marker to display the location marker on the map.
  • Enter the text message that you want to give for the contact page.
  • To place the contact form on the page, click on ‘Contact Form 7’.
  • Enter the API key for your Google Map. If you don’t have it, click on the provided link to get your API.
  • Enter your location’s latitude.
  • Enter your location’s longitude.
  • Set the level of zoom for your map.

  • Click Publish.

Contact Detail Settings

You can add or change the details regarding your contact in this panel.

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize > Contact Page Settings > Contact Details Settings
  • Enable Contact Details to let your visitors know the details where they can contact you.
  • Enter a label for the title of contact information.
  • Enter text message to provide and elaborate the contact information.
  • Enter phone number for contact.
  • Enter the title for the phone contact number.
  • Enter your email.
  • Enter a label for your Contact Email title.
  • Enter your detailed address and title for the address info.
  • Enable Social Links to show your social media profiles for your visitors to follow.
  • Enter the label for your social links.
  • Click Publish.

Sidebar Settings

You can add and configure sidebars here. But, to add tools to the sidebar you should go to Appearance>Widgets.

Add a Sidebar

  • Login to your WordPress Dashboard.
  • Go to Appearance> Customize> Sidebar Settings
  • Click Add New sidebar.
  • Give the sidebar a name.
  • Click Publish.

You can see the new sidebar in Appearance > Widgets. Add a widget to the sidebar and click save to configure the newly created sidebar.

Configure Sidebar

  • Login to your WordPress Dashboard.
  • Go to Appearance > Customize > Sidebar Settings
  • Select Sidebars for various Pages, like Blog Page, Single Page, Single Post Page, etc. The sidebar selected under the particular pages will only be displayed on the page. For example: Blog Page Sidebar appears only on blog page.
  • Click Publish.

You can place ads at Google Adsense Optimized spots in Blossom Fashion Pro theme. You can place ads at 2 spots – before the content and after the content.

  • Login to your WordPress Dashboard.
  • Go to Appearance> Customize> Advertisement Settings

To place Ad before the content, go to Before Content AD Settings.

  • Enable the Ad Before Content. Blue is enabled.
  • Enable Ad code if you have a code for the advertisement. Otherwise upload image by clicking “Select image” and enter Ad link.
  • Enable Open Link in Different tab if you want to open the ad link in a new tab when users click your ad.
  • Click Publish.

To place Ad after the content, go to After Content AD Settings.

Navigation Menus (Create and Edit Menu)

You can create navigation menu from Customizer or from Dashboard. This theme supports two menus: Primary and Secondary. If you need more than two menus, you can add them in the sidebar using “Navigation Menu” widget.

Create a New Menu from Customizer

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize> Menus in the WordPress Dashboard.
  • Click on Create a New menu button.

  • Give a name to your menu and select whether you want to display the menu on Primary or Secondary location. If you select primary location, the menu will be displayed below the logo. If you select secondary location, the menu will be displayed above logo.
  • Click Next.

  • Click “Add Items” to add items (pages, posts, categories, custom links…) to the Menu
    Click “+” icon on the items list to add the item to the menu.
  • Drag and Drop the added items to rearrange them.
  • Click Publish.

Create Menu from Dashboard

  • Login to your WordPress Dashboard.
  • Go to Appearance > Menus in the WordPress Dashboard.

  • Click on create a new menu.

  • Give a name to your menu in Menu Name and click Create Menu button.

  • Select the items from Pages, Posts, Custom Links, or Categories and click “Add to Menu”.

  • Drag and Drop the added items to rearrange them.
  • Check the Menu location to Primary or Footer.
  • Click Save Menu.

Widgets

You can add the widgets to the sidebar in two ways – via Dashboard and Customizer.

Adding Widgets via Customizer

  • Login to your WordPress Dashboard.
  • Go to Appearance> Customize> Widgets
  • Make sure you are on the page you want to add widgets to.
  • Click on the desired Sidebar or location (the one you want to add widgets to). You can add widgets on Footer as well.
  • Click on Add a Widget to add widgets.
  • Select desired Widgets and give title to the widget.
  • Click Add a Widget to add more widgets in the sidebar.
  • Drag and reorder the widget as desired.
  • Click Publish.

Adding Widgets via Dashboard

  • Login to your WordPress Dashboard.
  • Go to Appearance> Widgets
  • Available widgets are listed on the left hand side while Sidebars are listed on the right side (including the sidebars you create)
  • Drag and drop the widgets to the desired sidebars. Or, click on the widget and select the sidebar you want to add the widget to.

Footer Section

The theme allows you to add your own desired credit or copyright text in the footer area of the page. To do this:

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize > Footer Settings
  • Enter your text in the provided space.
  • Enable Hide Author Link if you do not want to display your author link in the footer section.
  • Enable Hide WordPress Link if you do not want to display your WordPress link in the footer section.
  • Click Publish when satisfied.

WooCommerce Settings

You can set up and manage your WooCommerce from this panel. The theme allows you to put up Store Notice on your blog, display Product Catalog as well as Product Images.

  • Log in to your WordPress Dashboard.
  • Go to Appearance > Customize > WooCommerce
  • To show events or promotions to visitors site-wide, go to Store Notice.
  • To display product catalog, go to Product Catalog and select the products or categories to be displayed, method of sorting the product, number of products to be shown in each row, and rows per page.
  • To upload or change product image settings, go to Product Images and choose the main image width, thumbnail width, and thumbnail cropping ration.
  • Click Publish when satisfied.

Additional CSS

You can add extra CSS codes here. If you want to modify the color, fonts, or any other CSS effects, you can enter the code here.

  • Login to your WordPress Dashboard.
  • Go to Appearance> Additional CSS
  • Enter your code.
  • Click Publish when you are done.

Useful Tips

  • We highly recommend to use Child Theme if you need to change the code of the theme. Do not change the codes in the files of the parent theme as all such changes will be lost when the theme is updated. You can create a child theme using a plugin or manually by following the official guide.
  • Always keep a BackUp of your theme before making any changes to the theme.
  • If you get any problem in using the theme, you can do the following things:
  • Deactivate the plugins, sometime plugin conflict may cause issues with the theme. Please deactivate the unused plugins.
  • Replace the latest modified code with the original code.
  • If the issue pertains, feel free to contact us using our Support Ticket.