Theme Documentation

What is queen theme ?

The Multipurpose shopify theme 2.0

Queen is a multipurpose next-generation Shopify theme, which is suitable for all types of e-commerce buisness store of all growth levels and industries.

There are more over 60+ Demos like Jewelry & Accessories, Clothing and Fashion, Health & Beauty, Home Decor & Furniture, Electronic & Gadgets, Garden & Other, Fastfood & Drink, Sports & Travel

To help you navigate through the installation, configuration, and customization processes, we have meticulously prepared this comprehensive document. Whether you're a beginner, an experienced user, or a developer, we've tailored the content to cater to your specific needs.

If you're new to Shopify, we recommend starting with the SHOPIFY GUIDE before delving into the theme document. Familiarizing yourself with the Shopify platform will provide a solid foundation for working with our theme effectively.

Theme Installation

When you purchase and download our theme, there are many files you see in when you extract the file.

Documentation file is information about all over our theme for installation and customization.

Theme file is package file OR shopify theme file.

PSD file is theme psd for your information.

Product csv file is product file for information about how to upload bulk product in shopify.

Open your shopify store admin > online store > theme > click on add theme > upload your package file and publish it.

Announcement bar

Click on Add section in left side section add.

Click on add block to add more slider content, announcement your discount here to attract a more customers.

cusomization of call functionality and currency/language is available in section settings.

Here some another settings show in below image.

Header section

Via header customization you customize main theme logo, navigation menu, favicon , Sticky header types.

Here we provide many types of designed header.

Header customization as below

- Megamenu creating

- Badge point creating in megamenu like below

Admin panel > navigation > create menu

During create menu , when you give the name of child menu then add [sale] OR [hot] OR [new] in last of the menu name

Collection[new] OR Collection[hot] OR Collection[sale]

Example is as given below

- Image and link add in megamenu

Go to admin panel > content > files > upload file > copy CDN link

When you creatimg megamenu and child menu paste this CDN link after adding "|" in name

Exapmple:- menuname|CDN link

Slideshow section

Here we provide 6 types of slideshow , five slideshow attached in single section and one is in anothere separate section.

To customization of slideshow see in below image.

When you select section slider for top "Slideshow style 2" the customization is same as below.

If you need to upload a video in slider than first you upload your video in your localhost file and than copy link and past the link in
customization block video text block.

Aboutus section

Here is some customization available try to explain in image.

We have more then 3 aboutus sections so here we provide image to explain customization section wise.

You see same settings available in about us style 4, so go same as upper image.

This all settings must be set with sections.

Note: if you select local video than you need to attached the local host CDN link in customization.

Note: if you select online video than you need to attached online youtube link in customization.

Shipping section

Shipping or service section is available for store owner can give other special services for their customers.

Like fast shipping and gift wrapping, online support, flexible payment etc.

Marquee text slider and Email signup section

Cross image with text

When you need to add this section as cross you add block as show in image

Gallery Section

Gallery section is adding for to show multiple advertizment of products.

Another achivement images also show in gallery section.

Home collapsible and image comparision section

Category collection section

We provide category collection styles 1 to 6

In category style 1 we provide another 3 types

In Category style 1, first you select your style classic, modern, trendy and then you go for customization.

Here below we provide some customization examples , all categories have same options for customization related their section design.

Featured and tab product section

Here is all settings about the product including tab section product, where you see product in any section the settings and customization is same as below in all.

We already explain about "How to upload and listing the products ?" and also Explaining about "How to upload and listing the collections ?"

- Product features positions

- Product hover styles

- Countdown see in perticular product via metafield

Go to admin panel

settings > custom data > metafields > products > add definitions

Now go to your admin panel > click on product > scroll down > you see there are option available for metafield

Parallax section

Parallax scrolling is used to add visual interest to a website and engage users as they scroll through a web page.

In a parallax scrolling effect, both the foreground and background are moving, but the background typically moves much more slowly, giving the illusion of depth.

Testimonial section

Testimonial section is to show your client review and in this section you add product.

There are option to select review as need and add product to show customers review product.

Banner section

In Banner style 1 there are simple and easy customization available, you just add contents and image.

In Banner style- 2,3,4 some other customization explain as below.

Banner section

In Banner style 1 there are simple and easy customization available, you just add contents and image.

In Banner style- 2,3,4 some other customization explain as below.

Blog section

For adding a blog post and main blog follow below steps

Got to your admin panel > Click online store > blog post > add blog post

For adding a main blog follow below steps

Got to your admin panel > Click online store > blog post > manage blog > add blog > Fill all requirements and save.

- Customization of blog section

Footer section

There are 2 footer style available you can customize as your need.

When you select footer style 1 then news letter customization is available in perticular newsletter block.

When you select footer style 2 then news letter customization is available in main footer customization.

All customization about footer section is as below.

Footer bottom customization is available in main footer section customization, please scrolldown more and you see this type of customization

For see payment icons go to admin panel > settings > payments > choose a provider > choose your payment gateway

Install review apps

The theme comes with free apps which can be installed as per your use.

Product Reviews app

To enable product review click this link and start for installation

Now click on "Add App" button and proceed with general app installation procedure.

Once you are done with basic app setup, the app is ready to use.

Currency,Language and checkout settings

1) Multiple Currencies

Note:The above screenshot is from shopify admin for your reference. The current design is subject to change as per latest shopify updates.

Admin panel > Settings > Payments

Click on manage

In the Countries/regions section, click Add country/region.

Select the country or region that you want to support from the list of supported countries and regions.

Click Add country/region.

2) Multiple Languages

Admin panel > Settings > Languages

Click Add Language.

Choose a language from the drop-down menu, then click Add.

Click Visit Shopify App Store and follow the steps to install a translation app to your store.

Follow the steps in the app to translate your online store's content and publish new languages.

Click Preview to view different languages in your online store. You can preview both published and unpublished languages.

In Translated languages, click Publish language to make any of your translations available in your store. Click Unpublish language to remove any language you don't want available in your store. Click Delete to delete all translated content of a language from your online store.

Enable a language selector on the store front

You can enable language selector from the header configuration of your shopify theme. The detailed steps are mentioned in the Header Section Documentation below.

Note:The above screenshot is from shopify admin for your reference. The current design is subject to change as per latest shopify updates.

3) Checkout Settings

Admin panel > Settings / Checkout

You can allow/deny the customer account creation. You can also keep it optional.Generally, setting must be set to "Accounts are optional"

Note:The above screenshot is from shopify admin for your reference. The current design is subject to change as per latest shopify updates.

Theme Settings

It allows you to configure general theme settings like Product, Colors, Fonts and various other options

Here i show customization for Browser title notifications, Text style, Theme colors, Theme products color, Logo, Heading image, Colors, Breadcrumb, Cursor pointer, Typography, Layout, Popup Cookie, Popup Newsletter, Fack Product Popup, Image radius, Buttons, Inputs, Product cards, Collection cards, Blog cards, Content containers, Media, Dropdowns and pop-ups, Drawers, Badges, Icons, Social media, Search behavior, Currency format, Shipping Rates Calculator, Cart, Checkout, Custom CSS, Theme style etc.

- Browser title notification and Text style

Go to Customizer > Theme Settings

Scroll down to "Browser title notification" and configure all the parameters as per your requirements.

This setting is used for all heading of theme( To change its font-style like capitalize, uppercase, lowercase, inherit.)

- Theme color

Go to Customizer > Theme Settings

Scroll down to "Theme color" and configure all the parameters as per your requirements.

Theme color: Define for select your theme color as your need.

Theme main text: Define for sections main title available in all sections and pages.

Theme buttons: Define for all button available in theme available in sections and pages.

Theme navigation arrow: Define for all slider's next and prev button arrow.

Theme pagination: Define for all slider's pagination dots.

Theme input color : Define for give color for input text block( In newsletter popup where to write email, in search ajax available in header and many more input places.)

- Theme product color

Go to Customizer > Theme Settings

Scroll down to "Theme product color" and configure all the parameters as per your requirements.

Product features buttons: Color for wishlist, quickview, add to cart and compare button.

Product badge buttons: Color for sell badge and custom badge.

Product rating: Add color in product rating start.

Product countdown: To add color in countdown text( For adding countdown in all product we explain in featured and tab section in upper).

Product content: Color for product title and other contents.

- Favicon logo, Heading image, Breadcrumb, cursor pointer

Go to Customizer > Theme Settings

- Typography

Go to Customizer > Theme Settings

Scroll down to "Typography" and configure all the parameters as per your requirements.

When you select shopify font then just select font family in setting, but if you need a google fonts then select google font and add this font name in "Google font name" field

- Layout

Go to Customizer > Theme Settings

Scroll down to "Layout" and configure all the parameters as per your requirements.

- Cookies

Go to Customizer > Theme Settings

Scroll down to "Cookies" and configure all the parameters as per your requirements.

- Popup newsletter

Go to Customizer > Theme Settings

Scroll down to "Popup newsletter" and configure all the parameters as per your requirements.

- Fake product popup

Go to Customizer > Theme Settings

Scroll down to "Fake product popup" and configure all the parameters as per your requirements.

- Product, collection & blog cards

Go to Customizer > Theme Settings

- Badge and Social media

Go to Customizer > Theme Settings

- Search behavior

Go to Customizer > Theme Settings

- Shipping calculator

Go to Customizer > Theme Settings

For adding a shipping rates for products first during product listing add product weight.

Admin panel > settings > Shipping and delivery > in general shipping rates click the manage button to edit shipping.

Scroll down > shipping origins > create zone > select country > click done button

Click on Add rate button > You see one popup edit with yourself

- Cart

Go to Customizer > Theme Settings

In theme settings > cart option available for cart type

Choose option as your requirement

when select drawer > cart is open with side bar

When select page > caret is open with page

When select popup notification > cart open with popup in header

- Checkout

Go to Customizer > Theme Settings

Coupon code

Admin panel > Discounts > Create discount > Select discount type as per your requirement and fill all requirements.

When you give Discount code name than it is your discount code.

Add this code in cart page this code is directly calculate in checkout page.

For more information Click here Discount type

Complementery Product & Filter

Click here to install search & discovery app Search & Discovery

Complementery product :- After installation > Admin > Click on App > Serch & Discovery > Recommendation > Select product for add complementery > Click on brows button > Add product as your wish > Save

Filter for products :- After installation > Admin > Click on App > Serch & Discovery > Filter > Add filter > Click on search button > select your wish filter and add

Gift wrapper

There are options available for enable and disable the gift wrapping , coupon code and shipping calculatior in cart page customization.

Some customer are taking product with gift wrapping , if you need to give him the wrapping facility than follow below steps

Go to admin panel > product > add product
second step is creating the menu

Go to admin panel > Navigation > Add menu
When you clearly follow this steps you see the result is open in cart page like below.

Setup Pages

Online Store > Pages click button "Add a page"

1) Wishlist Page

Configure Title of the page "WishList".

Select Visibility: Visible

Select Template: page.wishlist

2) Contact Us Page

Configure Title of the page "Contact us".

Select Visibility: Visible

Select Template: page.contact

To configure contact us page, navigate to Customizer > Contact Us Page and configure required fields.

The default sections are added by default. You can click on "Add Section" to add sections as you want.

3) FAQ Page

Configure Title of the page "FAQ".

Select Visibility: Visible

Select Template: page.faq

To configure FAQ page, navigate to Customizer > FAQ Page and configure required fields.

The default sections are added by default. You can click on "Add Section" to add sections as you want.

4) About Us Page

Configure Title of the page "About Us".

Select Visibility: Visible

Select Template: page.aboutus

To configure About Us page, navigate to Customizer > About Us Page and configure required fields.

The default sections are added by default. You can click on "Add Section" to add sections as you want.

5) Size chart

Configure Title of the page "Size chart".

Select Visibility: Visible

Select Template: page.Default page

This size chart is use in product page size guide Popup, link this page in size guide button

6) Parivacy and policy , Return & exchange , Terms policy , Shipping policy

Configure Title of the page "Page title(Parivacy and policy OR Return & exchange OR Terms policy OR Shipping policy)".

Select Visibility: Visible

Select Template: page.(Parivacy and policy OR Return & exchange OR Terms policy OR Shipping policy)

This size chart is use in product page size guide Popup, link this page in size guide button

6) Product page

There are many features availabele you can add all fetures with adding a section form customization

In product page we add related product fetures at right side of product page in details.

For adding related product

Go to admin panel > settings > custom data > product > in name space and key fill with this "custom.related_product"

Select list of products

Go to admin panel > product > click on product > scroll down > select products

Filters

To unable product filter add app in your store( Search & Discovery ) Install this app

Go to your admin panel > App > Search & Discovery > Filter

This is product filter , by using this filter customer choose their favourite product.

Metafields

Here i clearify about how to add metafield in your store

Go to admin panel > settings > Custom data

Sizechart metafield

Go to your admin panel > settings > custom data > metafields > products > add definitions

Product variant custom color metafield

Go to your admin panel > settings > custom data > metafields > products > variants > add definitions

Read full change log here

Here we upload new theme queen shopify on date October 05, 2023

[v1.0] Created: October 05, 2023

Initial Release

Here we upload new theme queen shopify on date October 06, 2023

[v1.1] Created: October 06, 2023

Here we update our theme with new 6 theme showen as below

Home 26 - Halloween

Home 27 - Halloween fashion

Home 28 - Christmas

Home 29 - Chocolate store

Home 30 - Simple grocery

Home 31 - Mega grocery

Here we upload new theme queen shopify on date October 17, 2023

[v1.2] Created: October 17, 2023

Here we update our theme with new 9 theme showen as below

Home 32 - Casual fashion

Home 33 - Summer special

Home 34 - Exotic fashion

Home 35 - Formal fashion

Home 36 - Loungewear style

Home 37 - Minimalist fashion

Home 38 - Modest fashion

Home 39 - Socks fashion

Home 40 - Goggles fashion

Here we upload new theme queen shopify on date oct 23, 2023

[v1.3] Created: October 23, 2023

Here we update our theme with new 10 theme showen as below

Bag fashion

Suit

Ceramic

Flower

Soap

Wedding

Coffee

Fast food

Pet food

Pets mega

Here we upload new theme queen shopify on date oct 28, 2023

[v1.4] Created: October 28, 2023

Here we update our theme with new 8 theme showen as below

Wine awesome

Restaurent food

Mega autoparts

Mega tools

Barber

Cake

Gym body fitness

Hunting theme

Here We update another CSS issue and UI and UX changefa-spin

Megamenu and header CSS

Wishlist and compare JS and product title issue solve

Add schema in welcome or hero slider

header logo CSS change

Testimonial image Author image issue solved

Announcement bar truncate remove

Footer social icon heading remove

Dropdown menu issue solved

Header menu drawer CSS changes

sticky cart image width height set CSS Changes

Product add to cart and sold out button bug solve

Here We update another CSS issue and other update on date dec 11, 2023

Wow animation remove

You can add product variant custom color from metafield

You can add custom sizechart from metafield

Slideshow html and js change

Tab product html and js change

Note:-

1) The above screenshot is from shopify admin for your reference. The current design is subject to change as per latest shopify updates.

2) The images you see in the screenshots are used for demo purposes only, they are not incuded in the download package

What is queen theme ?

Theme Installation

Announcement bar

Header section

- Megamenu creating

- Badge point creating in megamenu like below

- Image and link add in megamenu

Slideshow section

Aboutus section

Shipping section

Marquee text slider and Email signup section

Cross image with text

Gallery Section

Home collapsible and image comparision section

Category collection section

Featured and tab product section

- Product features positions

- Product hover styles

- Countdown see in perticular product via metafield

Parallax section

Testimonial section

Banner section

Banner section

Blog section

- Customization of blog section

Footer section

Side widget and mobile bottom menu section

Install review apps

Product Reviews app

Currency,Language and checkout settings

1) Multiple Currencies

2) Multiple Languages

Enable a language selector on the store front

3) Checkout Settings

Theme Settings

- Browser title notification and Text style

- Theme color

- Theme product color

- Favicon logo, Heading image, Breadcrumb, cursor pointer

- Typography

- Layout

- Cookies

- Popup newsletter

- Fake product popup

- Product, collection & blog cards

- Badge and Social media

- Search behavior

- Shipping calculator

- Cart

- Checkout

Coupon code

Complementery Product & Filter

Gift wrapper

Setup Pages

1) Wishlist Page

2) Contact Us Page

3) FAQ Page

4) About Us Page

5) Size chart

6) Parivacy and policy , Return & exchange , Terms policy , Shipping policy

6) Product page

Filters

Metafields

Sizechart metafield

Product variant custom color metafield

Read full change log here