Theme requirements for the Theme Store

Information for designers and programmers
Written by Dennis
Updated 3 years ago

Table of Content 

  •  Important information to know before you apply
  •  Submitting Process
  •  Review Process
  •  Your theme in the branchbob Theme Store
  •  Theme Support
  •  Theme Layout
  •  Theme Structure
  •  Theme Alternate
  •  Theme Requirement
  •  References

I. Important information to know before you apply

The revenue share for theme partners is 70/30. The theme partner receives 70% of each theme sale.

II. Submitting Process 

Signup for a Developer Account

The theme partner willing to submit a design for branchbob stores have to ensure that the following requirements are included:

1.  A link to an active branchbob store.

2. Theme name.

3. Theme description.

4. Feature list.

5. Theme category.

6. Paypal payout adress.

7. Company details (VAT, company name, street, phone number, contact person).

8. Public support email address.

9. Theme documentation.

10. Preview template image (image can be seen in detail page):
Designer only upload an image (size: 850px ×1230 px). The Detail Page will scale it down to 574px × 830px. On the homepage, it will be scaled like a mockup. Each further upload will replace this image

11. Price.

III. Review Process

 Our review will cover:

1. Responsive check.

2. Pagespeed check.

3. Duplicated theme check to make sure the shop is using a custom theme, not a free or paid already existing theme from the branchbob Theme Store

4. Layout check including flow of content, hierarchy, balance, contrast, white space, responsiveness, grid, and alignment.

5. Typography check including font pairings, font sizes, line spacing, hierarchy of text, number of fonts used, and legibility of text.

6. Accessibility check including hover states, colour ratios, and touch targets.

7. Feedback email to developer to inform the theme partner if the theme was approved or rejected. The approved theme will be displayed in the branchbob Theme Store right after the approval.

III. Your theme in the branchbob Theme Store

Do not distribute your theme on other marketplaces or third-party channels like ThemeForest, or your own website or try to encite away customers from the branchbob Theme Store.

IV. Theme Support 

In case of an e.g. broken layout, dead link, logic error you are responsible for technical issues and critical bugs. Therefore you have to fix the issue in a timely fashion. Moreover branchbob theme partners are responsible for supporting merchants using their themes. Concerning that issue you will need to assist merchants with their theme-related questions via your provided public support email address and theme documentation. Theme Partners are also responsible for keeping their themes up-to-date with core branchbob features.

V. Theme Layout 

 Layout files are very important for your theme because every other template file is rendered inside the active layout. 

 master.html 

 The file is the default active layout when visitors are browsing your online store and/or website. It usually renders the header content, footer content, navigation, and other global variables.

VI. Theme structure 

 A Branchbob theme includes the following template files:

carousel.css
carousel.min.css
carousel.min.js
jscontact_us.css
contact_us.html
contact_us.js
design.css
design.js
logo.css
master.html
product.html

After the designer created a new store, a demo desgin will be created, and the developer can then reference it to design a new theme.

 Example:

VII. Alternate templates 

 There might be cases where you need a different markup for the same template, e.g. you might want a sidebar on one product page but not on the other. The workaround for this is to create alternate templates.

To create an alternate template:

Inside the section Designs, click "Create custom design". In the editor, select the type of template that you want to create and don't forget to hit save.

VIII. Theme store requirement 

The branchbob themes require some mandatory files:

master.html

This is the main file of the theme store. File contents include: 

1. To load JS/CSS files

 {% script_url js_file %} 
{% stylesheet_url css_file %} 

2. Implement shopcart  
 <script type='text/javascript'> var cart = new Wundery.Cart({  storeId: '{{ store.id }}', debug: true,  apiEndpoint: '{{ store.sdk.storefront_api_endpoint }}',
checkoutEndpoint: '{{ store.sdk.checkout_endpoint }}'});cart.setup();</script>);
3. Implement searching<span class='search'>{{ store.sdk.frontline_search_input_snippet }}</span>
4. To Load categories  {% for category in store.categories %} ... {% endfor %}
5. To check homepage {% if is_homepage %} ... {% endif %}
6. To check store has slideshows {% store.has_slideshows %} ... {% endif %}
7. To load category page  {% is_category %}...{% endif %}
8. To load product page {% is_product %}...{% endif %}
9. To load footer link {% is_page %}

...{% endif %}

product.html

 This file is used to render product details.

IX. Theme References 

 These are object attributes to output dynamic content on the page. For example, the product object contains an attribute called title that can be used to output the title of a product. Here are all the references:

stylesheet_url

 Return stylesheet url

script_url     

Return javascript url

page_url       

Return page url

setting        

Return css variable value, e.g.: '$color-ci: {% setting 'color_ci', '#f15f22' %};

is_homepage   

Return true if it is homepage

is_category   

Return true if it is category page

is_product    

Return true if it is product page

is_page       

Return true if it is page redirect from footer link

current_category

 Return the attributes of the category

title

 Return the title of the category

meta_description

 Return the meta description of the category

id

 Return the id of the category

long_description

 Return the long description of the category

products

 Return the products of the category

total_pages

 Return the total pages of the category

current_product

 Return the attributes of the product

meta_title

 Return the meta title of the product

meta_description

 Return the meta description of the product

default_variant

 Return the default variant of the product

original_price_net_formatted

 Return the original price net formatted of the product

inherited_price_net_formatted

 Return the inherited price net formatted of the product

original_price_gross_formatted

 Return the original price gross formatted of the product

inherited_price_gross_formatted

 Return the inherited price gross formatted of the product

inherited_base_price_description

 Return the inherited base price description of the product 

serialized

 Return the product json of the product

serialized_variants of the product

 Return the variants json of the product 

short_description

 Return the short description of the product

title

 Return the title of the product

default_image

 Return the default image of the product

images

 Return all images of the product

id

 Return the id of the product

video_url

 Return the video url of the product

video_source

 Return the video source of the product, e.g.: YouTube

video_id

 Return the video id of the product 

has_options

 Return true if the product has any options

options

 Return the options of the product

original_price_title

 Return the original price title of the product

tax_rate

 Return the tax rate of the product

delivery_time

 Return the delivery time of the product

url

 Return the url of the product

current_page

 Return the attributes of the page

title

 Return the title of the page 

content

 Return the content of the page

is_contact_us_page

 Return true if the page is contact us page

is_fees_page   

 Return true if the page is fees page

store

 Return the attributes of the store

id

 Return the id of the store

url

 Return the url of the store

locale

 Return the language of the store

logo

 Return the logo of the store

title

 Return the title of the store

slogan

 Return the slogan of the store

has_slideshows

 Return true if the store has sideshows

categories

 Return the categories of the store

slideshows

 Return the slideshows of the store

sdk

 Return the sdk library of the store

description

 Return the description of the store

promoted_homepage_products

 Return the promoted homepage products of the store

unpromoted_homepage_products

 Return the unpromoted homepage products of the store

notax_price_info

 Return the notax price information of the store

notax

 Return the notax of the store

shipping_methods

 Return the attributes of the store's shipping methods

title

 Return the title of the shipping methods

description

 Return the description of the shipping methods

zone

 Return the zone of the shipping methods 

price_formatted

 Return the price formatted of the shipping methods

free_at_formatted

 Return the free_at formated of the shipping methods

unshipable_countries

 Return the unshippable countries of the store

payment_methods

 Return the attributes of payment methods

title

 Return the title of the payment methods

processor_name

 Return the processor name of the payment methods

description

 Return the description of the payment methods

zone

 Return the zone of the payment methods

price_formatted

 Return the price formatted of the payment methods

unbillable_countries

 Return the unbillable countries of the store

payment_options

 Return the payment options of the store

twitter_url

 Return the twitter url of the store

facebook_url

 Return the facebook url of the store

pinterest_url

 Return the pinterest url of the store

youtube_url

 Return the youtube url of the store

instagram_url

 Return the instagram url of the store

pages

 Return the pages of the store

Did this answer your question?