-
Notifications
You must be signed in to change notification settings - Fork 8
Theme Structure
Ivan edited this page Aug 18, 2022
·
8 revisions
themes/starter/ # → Root of Starter theme
├── assets/ # → Theme assets: css, js, svg icons
│ ├── js/ # → Scripts
│ │ ├── blueimp/ # → Fileuploader plugin
│ │ ├── modules/ # → Custom script sources
│ │ │ ├── archive.js # → Filter/pagination ajax scripts
│ │ │ ├── comment.js # → Script for comments
│ │ │ ├── common.js # → Different common functions
│ │ │ ├── home_page.js # → Custom homepage tpl scripts
│ │ │ ├── menus.js # → Menus prototyping scripts
│ │ │ ├── recaptcha.js # → Recaptcha
│ │ │ └── single_product.js # → Single product page functions
│ │ ├── iosPreloadFix.js # → Bugfix for replace 'preload' into 'stylesheet' in <link>
│ │ ├── list_plugins.js # → Collect plugins from node_modules/
│ │ └── list_scripts.js # → Collect files from js/modules/
│ ├── scss/ # → Styles
│ │ ├── theme/ # → All scss custom files
│ │ │ ├── components/ # → Components
│ │ │ | ├── _carousel.scss # → Carousels
│ │ │ | ├── _components.scss # → Collect file
│ │ │ | ├── _footer.scss # → Footer
│ │ │ | ├── _header.scss # → Header
│ │ │ | ├── _minicart.scss # → Default woo widget minicart
│ │ │ | ├── _modal.scss # → Modal
│ │ │ | └── _wishlist.scss # → TI wishlist plugin styles
│ │ │ ├── mixins/ # → Mixins
│ │ │ | ├── _ellipsis.scss # → Ellipsis mixin (i.e. 3 dots at the end ...)
│ │ │ | ├── _flex_align.scss # → Flex align mixin - widely used
│ │ │ | ├── _img_item.scss # → Make image centered and limited inside box
│ │ │ | └── _mixins.scss # → Collect files
│ │ │ ├── pages/ # → Pages
│ │ │ | ├── _home.scss # → Custom homepage tpl styles
│ │ │ | ├── _pages.scss # → Collect file
│ │ │ | └── _support.scss # → Support pages styles (like FAQ)
│ │ │ ├── snippets/ # → Snippets
│ │ │ | ├── _forms.scss # → Form styles
│ │ │ | ├── _images.scss # → Image box classes for limit image size and object-fit
│ │ │ | ├── _list.scss # → Flex lists (for menus, social lists etc)
│ │ │ | ├── _menus.scss # → Menu prototyping styles
│ │ │ | ├── _pagination.scss # → WooCommerce pagination
│ │ │ | ├── _scrollup.scss # → Scrollup button
│ │ │ | ├── _select2.scss # → Select2: default woo component - used on checkout, account
│ │ │ | ├── _snippets.scss # → Collect file
│ │ │ | └── _wp_accessibility.scss # → Fork of twentyseventeen/style.css (2.0 Accessibility)
│ │ │ ├── woo/ # → Woo
│ │ │ | ├── _account.scss # → Account pages
│ │ │ | ├── _comment.scss # → Comment
│ │ │ | ├── _filters.scss # → Filter - archive page
│ │ │ | ├── _product_item.scss # → Product item
│ │ │ | ├── _rating.scss # → Rating
│ │ │ | ├── _single_product.scss # → Single product styles
│ │ │ | └── _woo.scss # → Collect file
│ │ │ ├── _common.scss # → Common styles
│ │ │ └── _variables.scss # → Bootstrap customization
│ │ ├── plugins.scss # → Plugin's modules (bootstrap & slick by default)
│ │ ├── styles.scss # → Custom modules
│ │ └── wp_admin.scss # → Styles for wordpress admin
│ └── svg-icons.svg # → Svg icons - used for decor graphics in theme (i.e. not content)
├── inc/ # → PHP logic
│ ├── acf-json/ # → Autogenerated ACF
│ ├── woocommerce/ # → WooCommerce logic
│ │ ├── comment/ # → Comment
│ │ │ ├── comment-backend.php # → Comment logic
│ │ │ ├── comment-customizer.php # → Customizer comment settings
│ │ │ └── comment.php # → Comment functions
│ │ ├── filter.php # → Filter functions
│ │ ├── upsell-related.php # → Upsell-related product
│ │ └── woocommerce.php # → Woo functions
│ ├── assets.php # → Manage assets
│ ├── customizer.php # → Customizer features
│ ├── image.php # → Image functions
│ ├── menu.php # → Menu functions
│ ├── recaptcha.php # → Google recaptcha
│ ├── tiny-mce-advanced.php # → WYSIWYG settings, improvements like font-family
│ └── twentyseventeen-functions.php # → Twentyseventeen forks: theme setup, starter_get_svg
├── templates/ # → Page templates
│ ├── page-home.php # → Home page template
│ └── page-support.php # → Support page template
├── woocommerce/ # → WooCommerce/TI wishlist ovveride templates
│ ├── loop/ # → Loop
│ │ ├── add-to-cart # → Add to cart
│ │ └── orderby.php # → Orderby
│ ├── single-product/ # → Single product
│ │ │ ├── add-to-cart/ # → Add to cart
│ │ │ | └── variation-add-to-cart-button.php # → Variation
│ │ │ ├── related.php # → Related products
│ │ │ └── up-sells.php # → Upsells
│ ├── archive-product.php # → Archive
│ ├── content-widget-price-filter.php # → Price filter
│ ├── product-searchform.php # → Search form
│ ├── single-product.php # → Single product
│ └── ti-wishlist-product-counter.php # → TI wishlist plugin counter
├── woocommerce-custom/ # → Custom additional templates
│ ├── comment/ # → Comment
│ │ ├── comment-form.php # → Comment form
│ │ ├── comment-image-modal.php # → Comment image modal (single page)
│ │ ├── comment-item.php # → Comment item (single page)
│ │ └── comment-section.php # → Whole comment section on single page
│ ├── global/ # → Different global template parts
│ │ ├── product-item.php # → Product item
│ │ └── rating.php # → Rating
│ └── single-image-modal.php # → Single image modal template
├── 404.php # → 404 page template
├── config.js # → Configs for gulpfile.js
├── footer.php # → Footer template
├── functions.php # → Theme functions
├── gulpfile.js # → Gulp tasks
├── header.php # → Header template
├── index.php # → Theme default index file
├── package.json # → Node.js dependencies and scripts
├── page.php # → Default page template
├── screenshot.jpg # → Theme screenshot for WP admin
└── style.css # → Theme meta information