Hello! I am a deprecated package. I've been moved to elcodi-plugins/StoreTemplateBundle. Thanks :D, (*1)
Custom templates for bamboo/elcodi
In order to make a template fully compatible with Bamboo engine (The elcodi e-commerce implementation) we have created a small standard. Customizing this bundle you can create themes for bamboo/elcodi. Please read this documentation carefully before edit anything., (*2)
Requirements for all the templates in live mode
To use the templates in a real environment you need to install and setup locally Bamboo/elcodi, (*3)
Requirements to preview twig files as html
It's possible to compile the twig files as html to preview your templates without need to have all the real environment. All you need to do is follow this steps:, (*4)
- Install NodeJS
- run "npm install" in the root directory of this template
- Install Ruby & Sass
- Run "Grunt" to compile or "Grunt Watch" to compile when you save any .twig or .scss file
Folders
Let's take a look to all the folders of this bundle and what can we find inside., (*5)
Fixtures
This folder contains json files with a simulation of the database and the vars you have available in each template.
This is a read-only folder, maybe could be useful for your information but you should don't change anything., (*6)
Resources
This is the main folder of your template. Inside this folder you will find two subfolders; Public & Views., (*7)
Public
This directory is to host the all the public files your template will need (images, fonts, javascript...).The structure of this folder is up to you, default implementation is just a suggestion., (*8)
Views
Here you can find al the .html.twig files that will be required for the store template. Check the section Template files to get more information., (*9)
SCSS
This default templates get SCSS code of this folder an compiles to "Resources/Public/css/". But this is just a suggestion, use Sass it's not mandatory and of course you can remove it and put your CSS directly in the public folder., (*10)
Work-environment folders
There are some folders that you will have after install the node modules, sass and grunt. These folders should never be committed and are just for the work environment, remember to git ignore them if it's necessary., (*11)
Template files, Context & Hooks
The twig templates are located at "Resources/views". In Bamboo we use Twig for the templates. So you can extend, include and organize your templates as you want.
All the files are organized by type, because some templates are required and other are totally up to you, the initial organization is just a proposal., (*12)
Global
The following context and hooks are available in all the twig files., (*13)
 Global context
All twig files will have the following contexts available:, (*14)
-
current_user_session_id : Current user session id
-
current_user_session_sha1 : Current user session id with sha1 applied
-
current_route_name : Current route name
-
store_tracker : Store tracker value. Unique per store.
 Global Hooks
All twig files will have the following contexts available:, (*15)
-
store.head_bottom : @todo add description
-
store.body_top : @todo add description
-
store.body_bottom : @todo add description
Layout
_checkout.html.twig
This layout is used on the checkout process pages, but it's not mandatory because at the end is calling the main layout file and overwriting the block "content"., (*16)
_email.html.twig
Layout used in the mails. The content of the emails are editable at the bamboo admin, this is just the container. @todo the template is empty, (*17)
_static.html.twig
This layout is mandatory, and it's called by all the static pages and blog pages. The static content will be rendered inside the block "content".
Context
- page : @todo add description, (*18)
_layout.html.twig
This is the the basic layout of your template, is mandatory and needs to start with{% extends '::_base.html.twig' %} and include the following blocks., (*19)
{% block head_style %}
This blocks is in the head of the page, the idea is to include here all the css or stuff you need to define inside the , (*20)
{% block body %}
This block starts and ends with the body... so here is where you need to add the html code to your template. The blocks defined inside this block are totally up to you., (*21)
This block starts just after the body block and just before to close the body. So, the idea is to include here all the scripts of the template., (*22)
Modules
All the files here are included inside others, so if you edit the include from the others you can organize this folder as you want. From our point of view, this organization makes sense but it's just our approximation., (*23)
Pages
All the files of this folder are required. This are the main files called from the controllers, so if you delete or rename one of them the template will not work., (*24)
cart-view.html.twig
Page shown the user clicks on the checkout button.
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*25)
cart-checkout-fail.html.twig
Page shown after something fails in the payment process., (*26)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*27)
cart-view.html.twig
List the products added to the cart., (*28)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*29)
category-view.html.twig
List the products inside a category., (*30)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*31)
home-view.html.twig
Homepage, list the products marked as shown in home., (*32)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*33)
order-list.html.twig
History list of orders done by the user., (*34)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*35)
order-view.html.twig
Details of one order., (*36)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*37)
product-view-item.html.twig
Detail of one product without variants., (*38)
Context
- @todo add context: @todo add description
Hooks
- store.product_view_bottom: @todo add hook description
- product: @todo add hook description, (*39)
product-view-variant.html.twig
Detail of one product with variants. By default extends the product-view-item.html.twig and overwrites the block product_info_add_basket., (*40)
Context
- @todo add context: @todo add description
Hooks
- store.product_view_bottom: @todo add hook description
- product: @todo add hook description, (*41)
static.html.twig
Layout for the static pages. The static content will be rendered inside the block "content"., (*42)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*43)
store-disable.html.twig
Page shown when the store is not configured as enabled., (*44)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*45)
store-under-construction.html.twig
Page shown when the store is marked as under construction., (*46)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*47)
user-edit.html.twig
Page inside the user control panel to edit the personal data. Only available if the user is logged., (*48)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*49)
user-home.html.twig
Homepage for the user control panel. Only available if the user is logged., (*50)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*51)
user-login.html.twig
Page with the form to login the user., (*52)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*53)
user-password-recover.html.twig
Page with the form to recover the password., (*54)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*55)
user-register.html.twig
Page with the form to user's registration., (*56)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*57)
address-edit.html.twig
Page shown when the user adds or edits his addresses. This page includes the LocationSelectors JS from the Geo bundle to make the city selectors work., (*58)
Context
- address: The address being edited, if the id field is set you are editing an address if itâs empty itâs a new address. View address object documentation
Hooks
- form: The add address form. View âstore_geo_form_type_addressâ documentation, (*59)
blog-posts-list.html.twig
Blog pagination. This page lists all available blog posts, including simple pagination. Number of posts is N, (*60)
Context
- blogPosts: Array of blogPost elements to be shown
- currentPage: Current page shown
- numberOfPages: Number of pages
Hooks
- store.blog_posts_list_bottom
-- blog_posts
-- current_page
-- number_of_pages, (*61)
blog-posts-view.html.twig
Blog post page., (*62)
Context
- blogPosts: Array of blogPost elements to be shown
Hooks
- store.blog_posts_list_bottom
-- blog_posts, (*63)
Subpages
All the files of this folder are required. A Subpage is a Module included using the render method insted of include. Each subpage has a url to directly call them, but it makes no sense to go to this page, because are litte portions of the page. The reason to be Subpages instead of modules is just for performance and sustainability., (*64)
cart-nav.html.twig
This subpage is a module to preview the content of the cart, (*65)
Context
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*66)
category-nav.html.twig
This subpage is a module to display all the categories and subcategories, (*67)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*68)
coupon-add.html.twig
This subpage is a module to add a little form to add coupons to the cart, (*69)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*70)
currency-nav.html.twig
This subpage is a module to display all the currencies enabled in the store, (*71)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*72)
user-nav.html.twig
This subpage is a module to display the nav options for the user, (*73)
Context
- @todo add context: @todo add description
Hooks
- @todo add hook: @todo add hook description, (*74)
Objects data
These are all the objects detailed that you will get in the context. Check the templates context to see when they are available., (*75)
Address
These are all the forms objects detailed that you will get in the context. Check the templates context to see when they are available., (*76)
Questions?
If you have any questions, please feel free to ask on Gitter or email us to tech@elcodi.com, (*77)