SHINEY - Magento 2 Theme | Documentation
SHINEY - Getting Started
- Created On: 14th October, 2016
- Last Updated On: 2nd June, 2022
- By: Solwin Team
- Email: info@solwininfotech.com
Introduction
Thank you for downloading Magento theme. This documentation consists of several parts and covers the entire process of installing and setting up Magento 2 theme starting from scratch.
SHINEY Theme files structure
The theme package you have downloaded consists of several folders. Let's see what each folder contains:
-
- documentation
- contains documentation files.
-
- index.html
- a main documentation file you are reading at the moment.
-
- sources
- contains the theme source files.
-
- demo-pages.zip
- contains all the demo cms pages .txt files
- demo-blocks.zip
- contains all the demo static blocks .txt files
-
- theme-files
- contains shiney theme files data
-
- shiney-theme.zip
- contains shiney theme files
-
- shiney-theme-magento-2.1.x-patch
- contains shiney theme patch files for magento 2.1.x.
-
- shiney-theme-magento-2.2.x-patch
- contains shiney theme patch files for magento 2.2.x.
-
- shiney-theme-magento-2.3.x-patch
- contains shiney theme patch files for magento 2.3.x.
-
- shiney-demo.url
- redirect to shiney theme demo.
Prerequisite
Before you install Magento, you must check all of the following:
Apache
- You must run Apache version 2.2 or 2.4.
- In addition, the apache mod_rewrite module must be enabled. mod_rewrite enables the server to perform URL rewriting.
PHP
For Magento 2.1 version
- PHP 5.6.X, 5.5.22, 7.0.2, 7.0.4 and 7.0.6
For Magento 2.1 version
- PHP 5.6.5, 7.0.2, 7.0.4 and 7.0.6
For Magento 2.2 version
- PHP 7.0.13 and 7.1.0
For Magento 2.3 version
- PHP 7.1.3 and 7.2.0
Visit this magento official document page for further details of installation
https://devdocs.magento.com/guides/v2.2/install-gde/system-requirements-tech.html
Required PHP extensions:
- PDO/MySQL
- mbstring
- mcrypt
- mhash
- SimpleXML
- curl
- xsl
- gd, ImageMagick 6.3.7 (or later) or both
- soap
- intl
- bc-math (Enterprice Edition Only)
- openssl
MySQL
- You must run MySQL version 5.6 or later
File Permission
The web server user must have write access to the following files and directories:
- var
- app/etc
- pub
We recommend setting the permissions as follows:
- All directories have 770 permissions.
- 770 permissions give full control (that is, read/write/execute) to the owner and to the group and no permissions to anyone else.
- All files have 660 permissions.
- 660 permissions mean the owner and the group can read and write but other users have no permissions.
Complete installation
The complete installation method can be used if you want to set up a Magento store using a sample content. We assume that you have completed all the preparation steps.
The installation process consists of 3 stages:
1. Creating a database.
2. Uploading all the required files to the server.
3. Installing a Magento Commerce engine together with the template you have purchased.
Let's get started!
Creating a database
First, you need to prepare a new database for your Magento store. You can create the new database using the database management tool from your hosting control panel (usually PhpMyAdmin).
The following data will be received while creating a database: database name, database username, password and your server name. You need to save this data as you will need it for further Magento installation.
With the phpMyAdmin tool you will be able to create a new database in 3 simple steps(check the screen shots below):
1. Open the "Database" tab, you will see the list of databases.
2. Input your database name. Click "Create" button.
3. Your database has appeared in the list. In order to enter the database, click on its name in the list.
Magento Installation
When you are done with uploading files, you can start Magento engine installation process. Open your browser and in the address bar type your 'domain name/path to your Magento directory'. You should see the welcome screen. Please follow the instructions below to install Magento.
Step 1: Installation Assistant
Please read the license agreement and click the "Agree and Setup Magento" checkbox if you agree with the terms.
Server Readiness Check
Click the "Start Readiness Check" button to check your server settings compatibility with the Magento 2 engine requirements.
Step 2: Database connection
Here you need to input the database details and some initial settings. Add a Database – input your host name, database name, database user and password. Contact your hosting provider, if you don't have the necessary details.
Make sure you have a database created for the Magento installation. And also make sure it is clear, without any tables.
Step 3: Web Configuration
Here you can change Magento admin panel URL and the main store address. Other settings you can leave unchanged.
When the checking procedure is complete, click 'Next'. button.
Step 4: Localization
Select the required time zone, default currency and store language. In the Advanced Modules Configurations section you can also select default modules that should/shouldn't be installed. We recommend that you do not perform changes in this section.
When the checking procedure is complete, click 'Next'. button.
Step 5: Create Admin Account
Here you need to input personal details for the store owner and administrator.
Step 6: Install
The store configuration is done. Press the Install Now button to start the store installation process.
Step 7: Success
This is the final installation step. Copy the generated encryption key and keep it safe.
SHINEY theme installation
First of all, please make sure your Magento installation version meets the template requirements. If you are using an outdated Magento engine version, you need to upgrade it. Don't forget to make a backup of your store files and database. The detailed Magento update guide you will find on the site Magento Wiki.
If your Magento engine meets the template requirements, you can start the template installation.
1. Open the theme package(shiney-multipurpose-responsive-magento-theme.zip) and go to the Theme Files folder.
2. Extract "shiney-theme.zip" file and Upload the app & pub folder to the root Magento installation directory on your server. This folder includes the template files, that will not effect your existing files. If you are using Magento 2.1.x, Magento 2.2.x and Magento 2.3.x version then add the patch files..
3. Once done with uploading "app & pub" folder, you need to execute below command at magento root directory using command line
4. Run deploy command as specified:
- php bin/magento setup:upgrade
- For Magento 2.0.x and 2.1.x: php bin/magento setup:static-content:deploy
- For Magnento 2.2.x and Magento 2.3.x: php bin/magento
setup:static-content:deploy -f
5. Clear the cache either from the admin panel or command line php bin/magento cache:clean
For more details click here
Template configuration
We are going to review template configuration options based on the example. We will configure it the same way as our Live Demo template, without affecting products data.
Activate the new theme
1. (For 2.0.x) Open Magento admin panel and navigate to Stores > Configuration menu.
(For 2.1.x) Open Magento admin panel and navigate to Content > Design > Configuration menu.
2. (For 2.0.x) In the General menu select Design tab. Click Design Theme tab and in the Design Theme drop-down list select the required theme, then click Save Config button.
(For 2.1.x) Go to Edit.
(For 2.1.x) Select the template from dropdown. And click on 'Save Configuration'
Reindex data
1. To reindex data, Open System > Index Management
2. In the first column open the drop-down list and choose the "Select All" option.
3. In the top "Actions" selector choose "Update on save" option. It will allow automatically reindex the specified data after saving any settings in the admin panel.
Click "Submit" button.
Please be patient, this may take a while.
Reindex data using command line
In order to reindex data using command line, please execute below command at magento root directory
bin/magento indexer:reindex
For more details click here
Disable cache
In order to make the changes appear on your website with no delay, you need to disable cache. It prevents additional cache clearing actions after every change you make. You can enable it when you are done with store editing.
1. Open Magento admin panel and navigate to System > Cache Management menu.
2. In the first column open the drop-down list and choose the "Select All" option.
3. In the top "Refresh" field select "Disable" option.
4. Click "Submit" button.
Navigate to Theme Cpanel > Theme Settings
Save configuration once to save the default settings.
Import Static Blocks button import all the static blocks that comes with shiney theme. If you want to overwrite existing blocks than select Overwrite Existing Blocks to Yes and Save Config. Then after Click on Import Static Blocks button. Do same for import cms pages.
After import static blocks & pages, Click on Import Demo Data to import all demo data of extension that comes with shiney theme.
After import demo data, Import demo that you want to display on front side.
After Successfully import your demo, save Theme Settings and Design Settings and clear the Cache.
Logo configuration
For 2.0.x
Please follow these steps when setting up logo image included into the theme package (you can view it on the Live Demo page).
1. Open the Magento admin panel and select Stores > Configuration in the side menu.
2. Select the "General" tab.
3. In the "General" section, select the Design tab. Choose Header and upload your logo.
4. Click "Save Config" button.
For 2.1.x
Open Magento admin panel and navigate to Content > Design > Configuration menu.
2. Expand the "header" tab.
3. In the "Header" section, click on 'Upload' button to upload your logo.
4. Click "Save Configuration" button.
Pages configuration
From the top menu select Content > Pages. Here you can find all the store pages. Home page, About Us and Privacy and Cookie Policy should already be available, so you don't need to add them. You only need to update the pages HTML and XML content. Open any of them in order to get the access to the content.
To add Widget, Navigate to Content field click on Insert Widget.. button. It will open popup , from there select widget that you want to display on home page with widget options and click on Insert Widget button
Static blocks configuration
In the top menu navigate to Content > Blocks.
In the top right corner click the "Add New block" button to add a new static block.
Add Block title, identifier, select store view & add HTML code into the content area.
Click on Save Block button from upper right corner to save static block.
For change home page block image.
If you need to change below slider advertisment block.
Edit "Shiney Home Advertisement Block 1" and change image as you like.
Design Settings
Open Magento admin panel and navigate to Theme Cpanel.
Click on Theme Cpanel > Design Settings. Store owner can set different colors for different stores.
From Body Font Color, Store owner can set body text color.
From Body Font Size, Store owner can set body font size.
Set Main Wrapper & Content Background Color , Background image & style from Page Wrapper and Main Content Settings
Set Header Top, Header Search Block, Header Top Navigation Menu, Minicart block colors
Set Footer Top, Footer Newsletter block, Footer Social Block, Footer Middle block, Footer Bottom Block(Copyright) etc
Add custom css for footer
Theme Settings
Set Theme layout: Full-width Layout, Box Layout and Maximum Width: 1170, 1280 (Default)
Set Header type from 5 different header layout. show sharing addons, set home navigation link & text.
Set static block home page content, Slider width(full or boxed), Set main title image, Sidebar static blocks etc.
Set Footer top, footer middle 1, footer middle 2 & footer bottom settings.
Set Product list page settings like, show new & sale label, product block(3-block, 4-block) in a row, image width, show ratings, show add to compare & wishlist link etc
Set Product view page settings like, show sharing addons, show related, upsell & cross sell products etc
Set Contact page settings like, show google map, set store name, address, contact no., email etc
Show loader on home page or all pages with uploaded loader image
Import Static Blocks, Pages & Demo data that comes with a shiney theme
Homepage Configuration
How to change newsletter popup settings?
Go to Theme Cpanel > Newsletter > Configuration
From that you can change newsletter settings like,
General Settings: Show/hide Newsletter Popup
Content Display Settings: Show/hide/change main title, change main title font color, text size etc, set custom message, show newsletter popup checkbox, show background image etc
Popup Box Settings: Popup box height & width, open & close effect, set delay time for popup appear, set cookie expiration time etc
Social Options: Show social icons with url like facebook, google plus, twitter, youtube, flicker, vimeo, pinterest, instagram, foursquare, tumblr, rss, email etc
How to edit homepage slider?
To edit homepage slider content, please go to Admin Theme Cpanel > Banner Slider > Manage Bannerslider and you can add/edit bannerslider as per your requirement.
You can also change bannerslider configuration from Theme Cpanel > Banner Slider > Configuration
How to add advertising blocks on homepage?
To add advertisement static block on home page, Go to Content > Blocks. Edit Shiney Home Page Content static block.
Go to Content field. Click on Insert Widget... button. Now select CMS Static Block from Widget Type*. Now click on Select Block... button and select your advertisement static block. Click on Insert Widget button.
It will add advertisement static block on home page like,
How to add Latest Products widget on homepage?
Go to Content > Blocks. Edit Shiney Home Page Content static block.
Go to Content field. Click on Insert Widget... button. Now select Catalog Product List from Widget Type*. Set Title, Display Page Control, Number of Products to Display, Template, Cache Lifetime(seconds). Click on Insert Widget button.
It will add Latest Products widget on home page like,
How to add Featured Products widget on homepage?
Go to Content > Blocks. Edit Shiney Home Page Content static block.
Go to Content field. Click on Insert Widget... button. Now select Catalog Product List from Widget Type*. Set Title, Display Page Control, Number of Products to Display, Template, Cache Lifetime(seconds) & Conditions(Is Featured? to Yes). Click on Insert Widget button.
It will add Featured Products widget on home page like,
How to add Latest Blogs block on homepage?
To add Latest Blogs block on home page, Go to Content > Blocks. Edit Shiney Home Page Content static block.
Go to Content field. Click on Insert Widget... button. Now select CMS Static Block from Widget Type*. Now click on Select Block... button and select 'Shiney Home Blogs' static block. Click on Insert Widget button.
It will add latest post block on home page like,
How to add Brands block on homepage?
To add brands block on home page, Go to Content > Blocks. Edit Shiney Home Page Content static block.
Go to Content field. Click on Insert Widget... button. Now select CMS Static Block from Widget Type*. Now click on Select Block... button and select 'Shiney Home Brands' static block. Click on Insert Widget button. (same as latest blogs block)
It will add brands in slider on home page like,
How to change/edit footer block settings
Go to Theme Cpanel > Theme Settings > Footer. There are four main section
Footer Top: Set newsletter block & social icons
Footer Links: Show About us link in footer
Footer - Middle 1: Set footer contact block, information block, instagram block & theme features block
Footer - Middle 2: Show footer services block like 100% Satisfaction, Free Shipping, 24x7 Helpline, Money Back Guarantee
Footer - Bottom: Show copyright text and payment logos from static block
Banner Slider
- Enable Bannerslider: Yes | No.
- Slider Animation: Fade | Slide.
- Navigation Control: Normal | Thumbnails.
- Slideshow Speed: Set the speed of the slideshow.
- Direction: Horizontal | Vertical.
- Animation Loop: Yes | No.
- Smooth Height: Animate the height of the slider smoothly for slides of varying height.
- Set Initial Slide: Starting slide for the slider, in array notation.
- Enable Slideshow: Setup slideshow for the slider to animate automatically.
- Animation Speed: Set the speed of the animation, in milliseconds.
- Initial Delay: Set an initial delay, in milliseconds.
- Pause on Hover: Pause the slide show when hovering over style.
- Allow Touch Swipe Navigation: Allow touch swipe navigation of the slider on enable devices.
- Navigation Direction: Create previous/next arrow navigation.
- Allow Keyboard Navigation: Allow slider navigation via keyboard left/right key.
- Allow Mousewheel Navigation: Allows slider navigation via mousewheels.
- Previous Direction Text: Set the text for the "previous" directionNav item.
- Next Direction Text: Set the text for the "next" directionNav item.
Newsletter
General Settings
- Enable: Yes | No
Content Display Settings
- Show Main Title: Yes | No
- Main Title: Title for main text
- Use default main title settings: Use default font size and color for main title text section.
- Main Title Font Size: Set font size for mian title text.
- Main Title Text Color: Set font color for mian title text.
- Enable Csustom Message: Yes | No
- Custom Message: Enter custom message.
- Use Default Custom Message Settings: Use default font size and color for custom message text section.
- Custom message Font Size: Set font size for custom message text.
- Custom message Text Color: Set font color for custom message text.
- Subscribe Button Text: Set text for Subscribe button.
- Use Default Button Settings: Use default font size and color for subscribe button text section.
- Subscribe Button Background: Set subscribe button background color.
- Subscribe Button Hover Background: Set subscribe button background hover color.
- Subscribe button Text Color: Set font color for subscribe button text.
- Subscribe button Hover Text Color: Set font color for subscribe button hover text color.
- Show Newsletter 'show once' Checkbox: Yes | No
- 'Show once' Checkbox Label: Set checkbox label
- Display Image In Newsletter: Yes | No
- Upload Newsletter Image: Upload image for newsletter
- Newsletter Image Position: Set newsletter section image position to left pr right align
- Show Background Image: Yes | No
- Upload Newsletter Background Image: Upload image mewsletter background
Popup Box Settings
- Popup Width: Set newsletter popup width. Specify in pixels.
- Popup Height: Set newsletter popup height. Specify in pixels
- Popup Padding: Set newsletter popup innner padding. Specify in numeric
- Popup Box Border: Yes | No.
- Popup Border Color: Set newsletter popup box border color.
- Popup Open Effect: Fade | Elastic | None.
- Popup Open Speed: Set popup open speed. The value should be in milliseconds.
- Popup Open Method: Set popup open method like zoomin | ZoomOut.
- Popup Close Effect: Fade | Elastic | None
- Popup Close Speed: Set popup close speed. The value should be in milliseconds.
- Popup Close Method: Set popup Close method like zoomin | ZoomOut.
- Delay Time For Popup Appear: Set deilay time of popup. The value should be in milliseconds.
- Show Newsletter Popup Once: True | False.
- Cookie Expiration Time: Set cookie expiration time (In days).
Social Options
- Enable Social Media: Yes | No
- Social Block Title: Set title for social block.
- Use Default Social Title Settings: Yes | No
- Enable Facebook: Yes | No
- Facebook Url: Enter your facebook url.
- Use Default Icon Settings: Yes | No
- Enable Google+: Yes | No
- Google+ Url: Enter your Google+ url.
- Use Default Icon Settings: Yes | No
- Enable Twitter: Yes | No
- Twitter Url: Enter your Twitter url.
- Use Default Icon Settings: Yes | No
- Enable Youtube: Yes | No
- Youtube Url: Enter your Youtube url.
- Use Default Icon Settings: Yes | No
- Enable Flickr: Yes | No
- Flickr Url: Enter your Flicker url.
- Use Default Icon Settings: Yes | No
- Enable Vimeo:
- Enable Pinterest: Yes | No
- Pinterest Url: Enter your Pinterest url.
- Use Default Icon Settings: Yes | No
- Enable Instagram: Yes | No
- Instagram Url: Enter your Istagram url.
- Use Default Icon Settings: Yes | No
- Enable Foursquare: Yes | No
- Foursquare Url: Enter your Foursquare url.
- Use Default Icon Settings: Yes | No
- Enable Tumblr: Yes | No
- Tumblr Url: Enter your Tumblr url.
- Use Default Icon Settings: Yes | No
- Enable RSS: Yes | No
- RSS Url: Enter your RSS url.
- Use Default Icon Settings: Yes | No
- Enable Mail: Yes | No
- Email Address:
- Use Default Icon Settings: Yes | No
Scroll To Top
- Enable: Yes | No
- Display: Only Text | Only Image | Both Text and Image
- Position: Left | Right
- Text On Link: Set text for scroll to top
- Background Color: Set background color for scroll to top
- Background Hover Color: Set background hover color for scroll to top
- Text Colour: Set text color for scroll to top
- Text Hover Colour: Set text hover color for scroll to top
- Image for Link: Upload scroll to top image
- Image for Hover Link: Upload scroll to top image
Flicker
General
- Enable: Yes | No
- Flicker Id: Enter your flickr user id
General
- Enable: Yes | No
- User Id: Enter your instagram user id.
- Access Token: Enter your instagram access token.
Megamenu
General
- Enable: Yes | No
- Enable Sticky Menu: Yes | No
- Default Menu Type: Select menu type like Full With | Static Width | Clasic etc...
- Visible Menu Depth: Set menu depth level.
- Show The Link "Home": Yes | No
- Show "Home" Icon: Yes | No
Custom Links & Blocks
Set cusotm items and block for megamenu section like Title | ID or URL | Menu Type and Position etc...
Category Labels
Set cusotm Category label for mega menu like New | Sale | Hot! etc...
Megamenu Design Setting
Design Setting
- Use Custom: Yes | No
Top Menu Section
- Background Color: Set background color for top menu section.
- Text Color: Set text color for top menu section.
- Text Hover Color: Set text hover color for top menu section.
- Text Active Color: Set text active menu color for top menu section.
- Hover Background Color: Set menu text section hover background color for top menu section.
- Active Background Color: Set active menu text section background color for top menu section.
Sub Menu Section
- Background Color: Set sub menu section background color.
- Text Color: Set sub menu section text color.
- Text Hover Color: Set sub menu section text hover color.
- Text Active Color: Set sub menu section active menu text color.
Label Section
- Label 1 Color: Set albel 1 text color.
- Label 1 Background Color: Set albel 1 background color.
- Label 2 Color: Set albel 2 text color.
- Label 2 Background Color: Set albel 2 background color.
- Label 3 Color: Set albel 3 text color.
- Label 3 Background Color: Set albel 3 background color.
Conclusion
Shiney is a fully responsive, creative, clean, beautiful and multipurpose Magento 2 theme with latest web design trends. It is multi-purpose professional theme for any ecommerce business like electronics, fashion, jewelery, furniture etc… with readymade layouts and color options.
The following resources will help you to become a true Magento professional:
Useful resources
Help and Support
Frequently Asked Questions
What can cause the problem:
- - Magento cache (or external cache) was not flushed after installation of the theme.
- - Compilation mode was not disabled before installation.
- - Some of the theme files were not uploaded.
- - You edited theme files and accidentally removed or changed something in the files.
- - You have customized the theme by creating custom sub-theme and your modifications change/break the default behavior of the theme.
- - Sometimes you have installed other theme and some elements are currently affecting the current theme.
Massive Updates are Coming!
It's not the end. Here are some upcoming features of Shiney
- - Improved Layered Navigation
- - One Step Checkout
- - More Config Option
- - More Theme layout
Thanks for using Shiney Theme!
We would like to thank you for using our Shiney Magento 2 Theme! We are very pleased you have chosen Shiney for your next Magento store. If you have any difficulties with Shiney theme or need any additional service, do not hesitate to contact us. We provide 24/7 Support!
Regarding customization service based on our themes or other magento related, please contact us to support@solwininfotech.com. We have an amazing team to provide customization service who have done bunch of customization projects so far, will provide you reasonable quote before start.
We are very happy to assist you!