La structure des fichiers du nouveau thème Classic | Prestashop 1.7

La version stable de Prestashop 1.7 est sortie ce lundi et comme vous pourrez le constater, la structure des fichiers dans le dossier thème a totalement été remaniée. Maintenant, on retrouve un seul fichier CSS et JS pour tout le site. Les TPL sont classés dans différents dossiers: commandes, clients, catalogues….

Voici la nouvelle structure:

A) assets

| css
——> theme.css

| img
——> logo.png

| js
——> custom.js
——> theme.js

 

    Ce dossier comprend l’ensemble des fichiers CSS, Javacript et les images de votre thème

—————————

B) config

| theme.yml

    Ce dossier donne les informations sur le nom, la version et l’auteur du thème. Mais aussi les colonnes disponibles, les hooks et modules disponibles, la taille des images, les css, js utilisés….

—————————

C) modules

| blockreassurance
| contactform
| ps_banner
| ps_categorytree
| ps_contactinfo
| ps_currencyselector
| ps_customeraccountlinks
| ps_customersignin
| ps_emailsubscription
| ps_facetedsearch
| ps_featuredproducts
| ps_imageslider
| ps_languageselector
| ps_linklist
| ps_mainmenu
| ps_searchbar
| ps_sharebuttons
| ps_shoppingcart
| ps_socialfollow

    Ce dossier regroupe les modules de votre thème

—————————

D) preview.png

    Le fichier preview.png correspondant à  la vignette utilisée dans l’onglet thème du back-office de Prestashop pour illustrer le thème

—————————

E) templates

| _partials +
——> breadcrumb.tpl
——> footer.tpl
——> form-errors.tpl
——> form-fields.tpl
——> head.tpl
——> header.tpl
——> javascript.tpl
——> notifications.tpl
——> pagination.tpl
——> stylesheets.tpl

| catalog
——>_partials +
– active_filters.tpl
– facets.tpl
– miniatures +
           – brand.tpl
           – category.tpl
           – pack-product.tpl
           – product.tpl
– product-activation.tpl
– product-add-to-cart.tpl
– product-cover-thumbnails.tpl
– product-customization.tpl
– product-details.tpl
– product-discounts.tpl
– product-images-modal.tpl
– product-prices.tpl
– product-variants.tpl
– products-bottom.tpl
– products-top.tpl
– products.tpl
– quickview.tpl
– sort-orders.tpl
– variant-links.tpl
——> brands.tpl
——> listing +
– best-sales.tpl
– category.tpl
– manufacturer.tpl
– new-products.tpl
– prices-drop.tpl
– product-list.tpl
– search.tpl
– supplier.tpl
——> manufacturers.tpl
——> product.tpl
——> suppliers.tpl

| checkout
——> _partials +
– address-form.tpl
– address-selector-block.tpl
– cart-detailed-actions.tpl
– cart-detailed-product-line.tpl
– cart-detailed-totals.tpl
– cart-detailed.tpl
– cart-summary-items-subtotal.tpl
– cart-summary-product-line.tpl
– cart-summary-totals.tpl
– cart-summary.tpl
– cart-voucher.tpl
– customer-form.tpl
– footer.tpl
– header.tpl
– login-form.tpl
– order-confirmation-table.tpl
– order-final-summary-table.tpl
– order-final-summary.tpl
– steps +
     – addresses.tpl
     – checkout-step.tpl
     – payment.tpl
     – personal-information.tpl
     – shipping.tpl
——> cart-empty.tpl
——> cart.tpl
——> checkout-process.tpl
——> checkout.tpl
——> order-confirmation.tpl

| cms
——> _partials +
– sitemap-tree-branch.tpl
——> category.tpl
——> page.tpl
——> sitemap.tpl
——> stores.tpl

| contact.tpl

| customer
——> _partials +
– address-form.tpl
– block-address.tpl
– customer-form.tpl
– login-form.tpl
– my-account-links.tpl
– order-detail-no-return.tpl
– order-detail-return.tpl
– order-messages.tpl
——> address.tpl
——> addresses.tpl
——> authentication.tpl
——> discount.tpl
——> guest-login.tpl
——> guest-tracking.tpl
——> history.tpl
——> identity.tpl
——> my-account.tpl
——> order-detail.tpl
——> order-follow.tpl
——> order-return.tpl
——> order-slip.tpl
——> page.tpl
——> password-email.tpl
——> password-infos.tpl
——> password-new.tpl
——> registration.tpl

| errors
——> 404.tpl
——> forbidden.tpl
——> maintenance.tpl
——> not-found.tpl
——> restricted-country.tpl
——> static +
– 500.html
– 503.html

| index.tpl

| layouts
——> layout-both-columns.tpl
——> layout-content-only.tpl
——> layout-error.tpl
——> layout-full-width.tpl
——> layout-left-column.tpl
——> layout-right-column.tpl

| page.tpl

    Ce dossier fait référence à l’ensemble des fichiers tpl qui permet de faire fonctionner votre thème

—————————

E) _dev

| css
——> components +
– block-reassurance.scss
– cart.scss
– categories.scss
– checkout.scss
– contact.scss
– custom-text.scss
– customer.scss
– customization-modal.scss
– drop-down.scss
– errors.scss
– featuredproducts.scss
– footer.scss
– imageslider.scss
– mainmenu.scss
– products.scss
– quickview.scss
– search-widget.scss
– stores.scss
——>partials +
–  _commons.scss
–  _fonts.scss
–  _mixins.scss
–  _variables.scss
——>theme.scss

| img

| js
——> cart.js
——> checkout.js
——> components +
– block-cart.js
– drop-down.js
– form.js
– product-miniature.js
– product-select.js
– top-menu.js
——>customer.js
——>lib +
– bootstrap-filestyle.min.js
– jquery.scrollbox.min.js
——>listing.js
——>product.js
——>responsive.js
——>theme.js

    Ce dossier regroupe les fichiers sources de votre thème: scss, img, js.

Articles similaires

Connaître les modules de la page d’accueil | Astuce Prestashop 1.6
views 17396
Vous avez installé votre boutique Prestashop 1.6 et désirez modifier votre page d'accueil ? Ce petit tuto va vous aider à le faire en indiquant le nom du module que vous devez utiliser pour modifier votre slider, votre menu.... Ils sont facilement accessibles depuis votre back-office PrestaShop en cliquant sur l’onglet « Modules et services ». Si vous désirez aussi modifier le fichier tpl ou cs...
Modifier l’arrière-plan de votre boutique Prestashop 1.7
views 9605
Dans ce tutorial, nous allons voir comment modifier les couleurs de fond de votre boutique en ligne Prestashop 1.7. Tout se passe à l'intérieur des codes. 1) Haut de page 2) Contenu 3) Bas de page ------------------------------------------------------------------ A) Etape 1 : Ouvrir le fichier themes.css dans /themes/classic/assets/css/theme.css B) Etape 2 : Dans certaines ...
Configurer le moteur de recherche – Prestashop 1.7
views 8447
Le tutoriel d'aujourd'hui va vous permettre de configurer le moteur de recherche internet de votre boutique Prestashop 1.7 et ainsi de rendre visible vos produits lorsque qu’un client effectuera une recherche. Tout d'abord, connectez à votre back-office et dans le menu de gauche, sélectionnez Configurer -> Paramètres de la boutique -> Rechercher. Vous arrivez sur une page qui vous ...
Google Analytics et Prestashop : Installation et configuration
views 11045
Dans ce tutoriel,  nous allons voir comment installer Google Analytics sur son site Prestashop A) Qu'est-ce que Google Analytics ? Google Analytics est un service gratuit d'analyse d'audience d'un site Web. Il vous permet d'obtenir un grand nombre d'informations comme : le nombre de personnes qui visitent votre site ; la localisation géographique de vos visiteurs ; le taux de rebon...
Transformer les tabs de la page d’accueil en bloc | Astuce Prestashop 1.6
views 5097
Ce tutorial va vous permettre de transformer les tabs "Populaire", "Meilleurs ventes", "Nouveaux Produits" et "Promotions" de la page d'accueil en bloc Cette astuce Prestashop a été testée sur la version 1.6.1 Attention, cette astuce est conseillée pour les personnes qui connaissent un minimum Prestashop, html et css. A)  Bloc Populaire 1)  Aller dans Modules > Positions. 1.1 ) D...

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *