The theme can be installed through the WordPress Admin panel.
- Log in to the WordPress Admin panel.
- Go to Appearance -> Themes.
- Click on the Add New button, at the top of the screen.
- On the Add Themes screen, click on the Upload Theme.
- Click on the Choose theme, and then browse for theme file on your computer.
- Click on the Install Now to start the install process.
- After the installation is done, click on the Activate theme.
A detailed video for theme installation is available here: https://help.themeskingdom.com/how-to-install-and-setup-the-theme.
After activating the theme, you will be prompted to install the required plugins. Required plugins are:
JetPack is the world popular plugin that extends WordPress features. In the Scenery theme, it is used to extend galleries features and protection. The official documentation is available here: https://help.themeskingdom.com/jetpack-plugin/.
Kirki is a plugin that enhances theme experience by adding useful elements in the Customizer, like image position picker, font settings and such.
Slider Custom Post Type
Slider Custom Post Type plugin adds Slider post type to the theme.
MailChimp plugin allows you to add a MailChimp signup form widget to your WordPress quickly.
WooCommerce is a free eCommerce plugin that allows you to sell anything. Built to integrate seamlessly with WordPress, WooCommerce is the world’s favorite eCommerce solution that gives both store owners and developers complete control.
To set the theme as presented in our demo, you can import the demo file.
Before starting setup, please install and setup the WooCommerce plugin. During the setup process, you will need to set up store address, set payment methods and shipping methods. WooCommerce will also create all pages that are required for a shop – Shop, Cart, Checkout, and My Account.
To set up the theme, please follow the next steps:
- First, go to Pages -> Add New, and create pages Home, About and Blog. For Homepage, set the Featured Products template, while the other pages should use the Default template. The page with Featured Products Page will display products that are marked as Featured products.
- Go to Settings -> Reading. Select the homepage to display a static page. For the Homepage set Home page, and for Posts, page set Blog page.
- Create some posts – go to Posts -> Add New and create several posts. Be sure to Set featured images. All posts will be displayed on the Blog page.
- Go to Products -> Categories. Create several product categories – in our demo, we have created categories Books & Magazines, Living, Accessories, Clocks, Office, etc… Categories are used to group similar products – and to display product groups in the navigation. In our demo, we have also used product tags for different brands.
- Create several products and associate them with the product categories. Set featured image, enter a description, and price for each product. Add product tags to each product. As we have mentioned, the homepage displays the products that are marked as featured. After creating the product, click on Catalog visibility and mark the product as Featured.
- To set up the main navigation, go to Appearance -> Menus. Create a new menu and add items. Add all your pages. For Brands option, add placeholder item (custom link item with target #) and add product tags as subitems.
- Now it’s time to set the rest of the theme.
Go to Appearance -> Customize and set the following options:
- Site Identity: Set site logo and favicon.
- Content Options: Enable author bio on a single post.
- Theme Settings:
- Blog layout: Set blog layout to standard.
- Shop layout: Set it to 3 columns, and enable Show a product’s tag above its title
- Slider: Set ti to medium.
- Store Notice: Enter your notice if needed – you can use HTML to style text.
- Shop Header Settings: Enable both – My Account and Saved items, and Mini Cart.
The Customizer is a great WordPress feature that allows you to customize the theme and set theme options. Customization options available in the Customizer:
- Site Identity
- Header Media
- Background Image
- Content Options
- Homepage Settings
- Theme Settings
- Color Settings
- Footer Settings
- Font Settings
- Additional CSS
Site Identity allows you to set your site logo, title, tagline, and icon. The Site Title is the name of your site and it’s displayed in the header, where the logo is displayed. The Tagline is the short description or your motto, and it’s displayed just under the title.
- Logo: For logo set JPG, JPEG, or PNG image.
- Logo Size: Moving slider to the left or right will increase or decrease logo size. Changes in logo size will be displayed in the preview panel.
- Site Title: Name of your site. The Site Title is displayed only if the logo is not set.
- Tagline: Site punchline. The Tagline will be displayed together with a Logo or Site Title.
- Display Site Title and Tagline: If enabled, both Title and Tagline will be displayed in the header.
- Site Icon: The Site Icon is used as a browser and app icon for your site. Icons must be square and at least 512px wide and tall.
Header Media is the default section that allows the upload of the video in the header.
- Header Video: Upload your video in .mp4 format and minimize its file size for the best results.
- YouTube URL: Instead of uploading a video, you can paste a YouTube URL.
- Header Image: Click “Add new image” to upload an image file from your computer. Your theme works best with an image that matches the size of your video — you’ll be able to crop your image once you upload it for a perfect fit.
- Title: Title that will be displayed before the video starts playing.
- Title Color: The color of title.
- Text: Enter the short text that will be displayed with the title.
- Text Color: The color of the text in the header.
Depending on the use case, some users need to set a background image on the site. In Background Image panel you can set a background image. After choosing an image, you will be able to set background behavior.
- Preset: Defines image size – Fill Screen will stretch the image to fill the whole site; Fit to the screen will cover the only visible part of the site, and Repeat will keep original image proportions, but it will repeat the image. Custom allows you to manually set background parameters.
- Image Positions: Tool used to define what is the starting position for the image.
- Scroll with Page: Option available only if the background image is set to Repeat. If checked, the background will scroll together with the page content.
This option allows you to manage created menus quickly. You can select what menu will be displayed as Primary Menu or Social Menu. If you need to manage actual menu items, you can do that in Appearance -> Menu.
Content Options allows you to turn on or off author bio on the single post page.
The Widgets section allows you to manage widgets in the widget areas quickly. This option allows you the same possibility as the Widgets option in the WordPress admin panel.
This option works the same way as Settings -> Reading. It allows you to set them to read the latest post or to use static pages for landing and blog pages.
In the Theme Settings panel, you can set layout options for Blog, Shop, and Slider. The Blog can be set to display posts in a standard grid or in the shuffle – posts are displayed scattered around.
Theme colors are used to add a personal, artistic touch to the site. Lines Color Setting controls the color of lines on the homepage. The Background Color will define background color on the whole site, while other options are used for the text color on the site.
WooCommerce panel keeps settings specific for the Shop – layout, what products and categories will be displayed, and theme-specific image sizes for the Shop.
The Store Notice will appear at the bottom of your site. It’s used to display important information – e.g. delays in shipping, or discount promotions, etc. You can use HTML elements to style the notice.
Product Catalog defines how WooCommerce pages – main store page and product category pages – will display products, how many of the products will be displayed and in what layout.
- Shop page display: Choose what to display on the main shop page – products, categories or both.
- Category display: Choose what to display on product category pages – products, subcategories or both.
- Default product sorting: Defines what parameter will be used for default product sorting.
Settings related to image width on the shop and single product page.
- Main image width: Main product image width, which will be used on the single product page.
- Thumbnail width: Width for the main product image on the shop page.
- Thumbnail cropping: How the thumbnail will be cropped. There are three settings: 1:1 – an image will be cropped proportionally based on original dimensions; Custom – depending on the input value, cropping will use that proportion; uncropped – image will be scaled down.
Footer Settings have only text area. Add text to the footer copyright area. HTML elements can be used for formating.
The Font Settings panel is displayed only if the Kirki Framework plugin is installed and activated. Font Settings are used to set font families and weights for global text elements 一 content, headings, and navigation. Available fonts are from Google Fonts but without extended variants. If you need assistance on how to integrate additional variants, please submit a support ticket.
Additional CSS section is used for custom CSS classes, without interfering with the theme original CSS files or creating a child theme. These classes are always loaded first, before other stylesheets. In the Useful CSS Classes section, you can find some most used classes.