--- title: Concept Instructions description: "[Concept is an eCommerce WordPress theme](https://vivathemes.com/wordpress-theme/concept/) with a minimalist approach and beautiful portfolio layout. ### Theme installation Unzip file ***concept_unzip_first.zip*** that you downloaded from us and install ***concept.zip*** file. [Read more how to install a theme *→ *](https://vivathemes.com/knowledge-base/how-to-install-a-wordpress-theme/) ### Making theme look like demo Inside the package…" url: "https://vivathemes.com/knowledge-base/concept-instructions/" updated: "2020-09-26" category: Theme Instructions --- # Concept Instructions [Concept is an eCommerce WordPress theme](https://vivathemes.com/wordpress-theme/concept/) with a minimalist approach and beautiful portfolio layout. ### Theme installation Unzip file ***concept_unzip_first.zip*** that you downloaded from us and install ***concept.zip*** file. [Read more how to install a theme *→ *](https://vivathemes.com/knowledge-base/how-to-install-a-wordpress-theme/) ### Making theme look like demo Inside the package you will find a file named ***concept.WordPress.xml*** that you can use to import the demo content. [Read more how to make theme look like the demo *→*](https://vivathemes.com/knowledge-base/making-theme-look-like-the-demo/) ### Activate child theme This theme enables you to create and activate a child theme with just one click, which is the recommended way to modify themes.  [Learn how to create a child theme *→*](https://vivathemes.com/knowledge-base/create-child-themes-in-wordpress/) ### Adding a logo image Go to *Appearance → Customize →* *Site Identity* to add a logo image or edit your site title. [Learn how to update your site identity *→*](https://vivathemes.com/knowledge-base/updating-site-identity/) ### Setting up the menu This theme has two menu locations, the *Primary Menu* (main menu) and *Social* (the menu to display your social media profiles). Create menus and assign them to each of the available locations. [Learn how to setup WordPress menus *→*](https://vivathemes.com/knowledge-base/setting-up-wordpress-menus/) ### Social media icons This theme will automatically display links to your social media profiles as icons, using a Custom Menu. [Learn how to setup social media menu *→*](https://vivathemes.com/knowledge-base/setting-up-social-media-menu/) ### Configuring the slider This theme has a featured content slider in the home page. You can feature pages, posts, portfolio entries or WooCommerce products to the slider. - Create a page, post, a portfolio entry or product. - Add a featured image to the page you just created, that will be the image that will appear in the slider. Featured images will be resized automatically to *960x480px*. [Learn how to add featured images to a page or post *→*](https://vivathemes.com/knowledge-base/add-a-featured-image-to-a-page-or-post/) - In the bottom of the right column of your editor, there’s a section *Front Page Slider*, check the box to Feature the post in the front page slider. - Do this process for as many slides as you need. ![concept slider](https://vivathemes.com/wp-content/uploads/2020/05/concept-slider.jpg) By default, the featured image will be the slide's image and the slide will link to the page/post. If you’d like to use an image other than the featured image, create a custom field named ***slideimage*** and in the value area add the url of the image you want to use. If you want the slide to link to a different url create a custom field named ***slidelink ***and the value area add the url you want the slide to link when clicked upon. [Learn how to enable custom fields *→*](https://vivathemes.com/knowledge-base/enable-custom-fields-in-wordpress-posts-or-pages/) ### Front page widget As you can see in our demo, below the slider in the front page, there is a block of text with a call to action button. You can achieve that by adding a text widget or any other widget type to the Front Widget location. In your *Dashboard* go to *Appearance → Widgets *and add a widget to this location. [Learn how to add widgets *→*](https://vivathemes.com/knowledge-base/add-widgets-to-theme/) To add the call to action button with the same style as in our demo, use the following html code ```plain <div class="belowpost"><a class="btnmore" href="enter the url here">Read More</a></div> ``` ### Configuring the front page In the front page below the slider this theme will display the latest posts by default. You can assign a static page to display in front instead of the latest posts. [Learn how to display a static page in front *→*](https://vivathemes.com/knowledge-base/display-a-static-page-in-the-front-of-your-website/) This way you can have a default page, that is a page with a right sidebar, a full width page, your portfolio or featured products display in front, instead of the latest posts. ### Home page with featured portfolio This theme comes with a page template that allows you to show some entries from the portfolio and display it in the front page below the slider. - Create a page and assign the ***Portfolio*** page template to it.  [Learn how to change page templates *→*](https://vivathemes.com/knowledge-base/changing-page-templates-in-wordpress-pages/) - Assign this page to display in the front of your website [Learn how to display a static page in front *→*](https://vivathemes.com/knowledge-base/display-a-static-page-in-the-front-of-your-website/) - Change the amount of portfolio entries to be displayed by going to *Appearance → Customize →* *Theme Options.* ### Home page with WooCommerce products You can also display featured products in the Home page. - Create a page. - Add the shortcode below to this page ```plain [featured_products columns="3"] ``` - You can add a button below the shortcode to link to your shop from the front page ```plain <div class="belowpost"><a class="btnmore" href="shop url here">View All</a></div> ``` - Assign this page to display in the front of your website You can feature products by highlighting the '★' icon in the right of each product when viewed as list by going to *Products → All Products* in your *Dashboard*. ### Portfolio The portfolio will display the entries in a beautiful masonry style, adjusted automatically, in three different sizes. This depends entirely on the orientation of the featured image uploaded to each portfolio entry. Landscape featured images will be resized to **312x200px**. Portrait featured images will be resized to **312x452px**. To have a big image display like in our demo, the featured image needs to be square, minimum size should be **634x634px**, but will be resized to **634x452px** to maintain the clean look and so that the masonry layout displays better. - In your Dashboard go to *Portfolio → Add New.* - Add a featured image to each portfolio entry as specified above. - Include the Portfolio archive in you menu. ![concept portfolio](https://vivathemes.com/wp-content/uploads/2020/05/concept-portfolio.jpg) ### Infinite scroll Infinite scroll displays an ***Older Posts*** button instead of the default post navigation. To use this feature you need to install the [Jetpack plugin](https://wordpress.org/plugins/jetpack/). - In your *Dashboard* go to *Plugins → Add New* and search for Jetpack plugin, install and activate it. - In your *Dashboard* go to *Jetpack → Settings*. - Under ***Writing*** section check the radio button to **Load more posts with a button** or **as the reader scrolls down**. ### WooCommerce The theme does not need any special settings for WooCommerce, it is setup to work out of the box. If you want to use infinite scroll with WooCommerce, you need to add the Products archive page in your menu instead of the WooCommerce page. - In your *Dashboard* go to *Appearance → Menus*. - Click on *Products* and *View All* tab in the left column. - Add ***Products*** item to the menu. (please refer to the portfolio screenshot above). - To change the Shop archive title in your *Dashboard* go to *Appearance → Customize →* *Theme Options.* If you need help to get started with WooCommerce, [here](https://docs.woocommerce.com/document/managing-products/) is a tutorial. ### Page templates - **Default**: Content page with right sidebar. - **Full width**: Full width page, no sidebar. - **Portfolio page**: Page to display latest portfolio entries ### Widgets - **Right sidebar**: This location is visible in default pages, blog, single posts and single portfolio. - **Front widget**: Visible in the front page below the header. - **Footer widget**s: Visible throughout the website, in the footer. ### Featured Images sizes - Slider image: 960 x 480px - Blog landscape: 960 x 480px - Blog portrait: 300 x 400px - Portfolio landscape: 312 x 220px - Portfolio portrait: 312 x 452px - Portfolio square: 634 x 634px If you need more help regarding this theme, please [contact us](https://vivathemes.com/contact/).