BigCommerce: The Easy Way to Start an Online Business

Bigcommerce tutorial

In this article, we’ll see Bigcommerce Introduction.

Welcome to the world of BigCommerce, where creating and managing your own online store becomes a breeze.

Whether you’re a budding entrepreneur or an established business looking to expand your online presence, BigCommerce is here to simplify the e-commerce journey.

We’ll take you on a friendly tour of BigCommerce, highlighting its key features, benefits, and why it’s the perfect platform for your e-commerce dreams.

What is Bigcommerce?

Bigcommerce is an eCommerce platform that allows even the most novice of users to create a fully functional online store and sell both physical and digital products online.

Bigcommerce is one of those online store builders that have the capability to free up your time.

Bigcommerce currently powers over 55,000 online stores and has processed over $4 billion in transactions.

BigCommerce is a cloud-based eCommerce platform that allows businesses of all sizes to create and manage their online stores. BigCommerce offers a wide range of features and functionality, including:

  • A drag-and-drop store builder
  • A powerful admin dashboard
  • A comprehensive set of marketing tools
  • A robust reporting suite
  • A global network of partners and experts

The Template File Structure

Templates are available from the templates folder which is inside the application folder. Here you will find a list of folders for all of the templates available in your system. Inside each template folder is a list of files and folders that look like this:

  • Backup
    This is where backups are automatically saved when you edit a template file from within the control panel
  • Images
    Images for this template are stored here. You should save any images you wish to include in this folder.
  • Panels
    All Panel files are located here. See below for an explanation on Panel files.

    • Snippets
      Inside the Panels, the folder is a Snippets folder. All Snippets are located here. Snippets are explained further below.
  • Previews
    The Image preview used inside the control panel for each template is stored in this folder.
  • Styles
    The CSS files used inside the template are located here. Details on the different stylesheets found in this folder are below.

Layout, Panel, and Snippet files

Every file in the template system is a Layout file, a Panel file or a Snippet. The template system contains only HTML code and placeholders which identify another file to be included.

A placeholder starts and ends with %%.

For example %%Panel.PageHeader%% See the placeholders section for more information. There is a diagram below that shows visually how these template files are used to construct a page.

Layout files

A Layout file generally contains the overall structure of the web page in question. It generally includes a number of Panel files. All Layout files are located at the root of the template folder.

It will contain the HTML head section, and the basic structure of the document, with placeholders marking out where panels are to be positioned. Each layout file is used for a different section on the website.

For example, the Articles.html file is used when viewing an article while the Categories.html file is used when viewing a category or sub-category.

Layouts are available settings for each of the websites (such as home page, articles page, etc), however, pages and categories can use alternate template files.

This option is available in the control panel when creating or editing a page or category. The option will display either the Pages.html or Categories.html file in addition to any new layout files you have placed in the template folder.

This allows you to make template changes on a per page or per-category basis.

The default layout files available in all templates are:

  • Articles.html
    This layout file holds the layout of how articles are displayed and is used when an article is being read.
  • Authors.html
    This is the layout file for the author page and is used when viewing an author’s details.
  • Blogs.html
    This layout file corresponds to viewing a blog entry.
  • Categories.html
    When clicking on a category, this is the layout file that’s displayed.
  • Default.html
    This is the home page layout file. It’s the layout file used when first visiting your website. This is the first file you’d usually edit when starting your customization.
  • Maintenance.html
    This layout file is used whenever you select the “down for maintenance” option in your control panel. You don’t need to customize this file.
  • News.html
    This is the layout file that’s used when viewing a news item.
  • Other.html
    This layout file is used for the ‘template wrapping’ feature. See below for more information.
  • Pages.html
    Whenever a web pag” is created in the application, it uses this layout file.
  • Search.html
    This is the layout file used when visitors perform a search on your website.

Panel files

A panel file is used to indicate a block or section of the web page. A panel generally includes snippets for any repeated section of code (such as a list of articles), and may even include other panel files.

A panel file is included inside a layout file or another panel file by using the placeholder %%Panel.PanelName%% where PanelName is the name of the file located inside the “Panels” folder followed by .html.

For example, %%Panel.PageHeader%% indicates that the file /templates/templatename/Panels/PageHeader.html will be loaded in place of that placeholder.

Panels are unique in that they can have an associated PHP file. Most panel files will have this file, though it is not required. The PHP files are located in the /includes/display/ folder.

The PHP file will share the exact same name with the exception of the extension. For example; /includes/display/PageHeader.php is used with /templates/templatename/Panels/PageHeader.html.

The PHP will often retrieve dynamic information from the database and set up the placeholders for the template file. PHP panel files are responsible for setting up the GLOBAL and SNIPPET placeholders used with the .html panel files. Here is an example:

Code from the /includes/display/PageHeader.php

$GLOBALS['MyPlaceholder'] = "This is some <b>text</b> to show";

Code from /templates/templatename/Panels/PageHeader.html

%%GLOBAL_MyPlaceholder%%

The resulting output is:

This is some text to show

Snippets

A Snippet is a recurring piece of HTML or sometimes a small section of HTML that may not show up depending on the application settings (e.g. ratings for articles).

It is used by the server-side PHP code for recurring items such as a list. (eg.<li>Category Name</li>) A snippet can also include another snippet. Snippets are located inside the /templates/templatename/Panels/Snippets folder and are included using the %%SNIPPET_SnippetName%% where SnippetName is the name of the file.

For example, %%SNIPPET_MenuLinks%% indicates that the file /templates/templatename/Panels/Snippets/MenuLinks.html will be loaded.


Benefits Using Bigcommerce

  • Flexibility (Bigcommerce is scaled to be flexible, regardless of the store type)
  • No limitations (all design tools are at your disposal, certain features are unlimited – bandwidth & products)
  • Ready for the future (your store will grow but Bigcommerce will not change or ask you to upgrade plans)
  • Built-in features (biggest selection of “out of the box features)
  • User-friendly platform
  • Customization (use & customize their themes or design your own)

How to get started with BigCommerce

To get started with BigCommerce, you will need to:

  1. Create a BigCommerce account.
  2. Choose a plan. BigCommerce offers a variety of plans to fit your needs, from a basic plan for small businesses to a enterprise plan for large businesses.
  3. Choose a theme. BigCommerce offers a variety of themes to choose from, or you can create your own custom theme.
  4. Add products. You can add products to your store by uploading them from your computer or by connecting your store to a product feed.
  5. Set up shipping and payment. You will need to set up shipping and payment options for your store.
  6. Launch your store. Once you have added products, set up shipping and payment, and customized your store, you can launch your store and start selling.

BigCommerce is your trusted companion on the path to e-commerce success.

With its user-friendly interface, extensive features, scalability, mobile optimization, SEO capabilities, integrations, security measures, and top-notch support, BigCommerce offers everything you need to build and grow your online store.

Say goodbye to complex setups and hello to a friendly and empowering platform that puts you in control of your e-commerce destiny. Get started with BigCommerce and unlock the door to e-commerce success today.

Hope this article helps!

Write a Reply or Comment

Your email address will not be published. Required fields are marked *