{foreach $product.images as $image}
{/foreach}
{/if}
{$product.name}
{$product.price|wa_currency:$product.currency}
{if $product.description}
{$product.description}
{/if}
{* Product features *}
{if $product.features}
{_w('Specifications')}
-
{foreach $product.features as $feature}
- {$feature.name}:
- {$feature.value} {/foreach}
Русский контент
{else}
English content
{/if}
```
--------------------------------
### Product Tabs Navigation and Content
Source: https://github.com/adgooroo/webasyst-themes-api/blob/main/05-shop-script-themes.md
Manages the navigation and display of product-specific information through tabs. Includes sections for Description, Specifications, Reviews, and Shipping & Returns. Tab visibility and content are dynamically controlled using Smarty conditionals and loops.
```HTML/Smarty
{* Product tabs *}
{if $product.description}
{if $product.features}
{$product.description}
{else}
{_w('No description available.')}
{/if}| {$feature.name|escape} | {$feature.value|escape} |
{include file="includes/product-reviews.html"}
{_w('Shipping Information')}
{_w('Free shipping on orders over $50. Standard delivery takes 3-5 business days.')}
{_w('Returns & Exchanges')}
{_w('30-day return policy. Items must be in original condition.')}
Current page: {$wa->currentUrl()}
```
--------------------------------
### PHP Product Display Controller for Webasyst Shop
Source: https://github.com/adgooroo/webasyst-themes-api/blob/main/03-php-smarty-integration.md
Demonstrates a PHP controller (`shopFrontendProductAction`) for displaying product details in a Webasyst shop. It fetches product data, processes pricing and stock, loads reviews, and assigns data to the template for rendering. Requires Webasyst framework components.
```PHP
getById($product_id);
if (!$product || !$product['status']) {
throw new waException('Product not found', 404);
}
// Load additional product data
$product_service = new shopProductService();
$product_data = $product_service->getProductData($product_id, [
'images' => true,
'features' => true,
'reviews' => true,
'related' => true,
'categories' => true,
'tags' => true
]);
// Process pricing
$this->processProductPricing($product_data);
// Handle stock information
$this->processStockInfo($product_data);
// Load reviews
$reviews = $this->getProductReviews($product_id);
// Assign data to template
$this->view->assign([
'product' => $product_data,
'reviews' => $reviews,
'breadcrumbs' => $this->getBreadcrumbs($product_data),
'meta_title' => $product_data['meta_title'] ?: $product_data['name'],
'meta_description' => $product_data['meta_description'] ?: $product_data['summary'],
'canonical_url' => wa()->getRouteUrl('shop/frontend/product', ['id' => $product_id])
]);
// Set page metadata
$this->setPageMeta($product_data);
}
private function processProductPricing($product)
{
$currency = wa('shop')->getConfig()->getCurrency();
$product['formatted_price'] = waCurrency::format('%{h}', $product['price'], $currency);
if ($product['compare_price'] > $product['price']) {
$product['formatted_compare_price'] = waCurrency::format('%{h}', $product['compare_price'], $currency);
$product['discount_percent'] = round((1 - $product['price'] / $product['compare_price']) * 100);
}
return $product;
}
private function processStockInfo($product)
{
$stock_model = new shopProductStocksModel();
$stocks = $stock_model->getByProduct($product['id']);
$product['in_stock'] = array_sum(array_column($stocks, 'count')) > 0;
$product['stock_count'] = array_sum(array_column($stocks, 'count'));
return $product;
}
private function getProductReviews($product_id, $limit = 10)
{
$review_model = new shopProductReviewsModel();
return $review_model->getByProduct($product_id, [
'limit' => $limit,
'approved' => true,
'order' => 'datetime DESC'
]);
}
private function getBreadcrumbs($product)
{
$breadcrumbs = [];
// Add category breadcrumbs
if (!empty($product['categories'])) {
$category = current($product['categories']);
$category_model = new shopCategoryModel();
$category_path = $category_model->getPath($category['id']);
foreach ($category_path as $cat) {
$breadcrumbs[] = [
'name' => $cat['name'],
'url' => wa()->getRouteUrl('shop/frontend/category', ['category_url' => $cat['url']])
];
}
}
// Add product name
$breadcrumbs[] = [
'name' => $product['name'],
'url' => ''
];
return $breadcrumbs;
}
private function setPageMeta($product)
{
// Set page title
wa()->getResponse()->setTitle($product['meta_title'] ?: $product['name']);
// Set meta description
if ($product['meta_description']) {
wa()->getResponse()->setMeta('description', $product['meta_description']);
}
// Set Open Graph tags
wa()->getResponse()->setMeta('og:title', $product['name']);
wa()->getResponse()->setMeta('og:description', $product['summary']);
wa()->getResponse()->setMeta('og:type', 'product');
if (!empty($product['images'])) {
$image = current($product['images']);
wa()->getResponse()->setMeta('og:image', $image['url_big']);
}
}
}
```
--------------------------------
### Display Product Details with Smarty
Source: https://github.com/adgooroo/webasyst-themes-api/blob/main/05-shop-script-themes.md
This Smarty template (`product.html`) renders a product's details, including its gallery, badges, pricing, and stock status. It uses variables like `$product` and `$wa_theme_url` to populate content and includes schema.org markup for product information. The template handles conditional display of elements like multiple images, zoom buttons, and stock indicators.
```smarty
{* Product gallery *}
{* Product pricing *}
{if $product.images}
{if $product.images|count > 1}
{/if}
{if $product.images|count > 1}
{/if}
{* Product badges *}
{* Product information *}
{if $product.images|count > 1}
{/if}
{foreach $product.images as $image}
{/foreach}
{/if}
{else}
{if $product.badge}
{$product.badge|escape}
{/if}
{if $product.compare_price > $product.price}
-{math equation="round((1 - price/compare_price) * 100)" price=$product.price compare_price=$product.compare_price}%
{/if}
{if $product.count <= $product.low_stock_threshold && $product.count > 0}
{_w('Low Stock')}
{/if}
{$product.name|escape}
{if $product.sku}
{_w('SKU')}: {$product.sku|escape}
{/if}
{if $product.brand}
{$product.brand|escape}
{/if}
{if $product.compare_price > $product.price}
{shop_currency}{$product.compare_price}
{/if}
{shop_currency}{$product.price}
{* Stock status *}
{if $product.count > 0}
{if $product.count > 10}
{_w('In Stock')}
{else}
{_w('%d left in stock', $product.count)}
{/if}
{else}
{_w('Out of Stock')}
{/if}
{* Product summary *}
{if $product.summary}
{$product.summary|nl2br}
{/if}
{* Product variants (size, color, etc.) *}
{if $product.skus}
```
--------------------------------
### Site Theme Directory Structure
Source: https://github.com/adgooroo/webasyst-themes-api/blob/main/06-site-app-themes.md
Illustrates the standard file and directory organization for a Webasyst Site app theme. This structure includes the theme manifest, base layout, homepage and page templates, reusable include components, and directories for CSS and JavaScript files.
```text
site-theme/
├── theme.xml # Theme manifest
├── layout.html # Base layout
├── index.html # Homepage template
├── page.html # Static page template
├── blog/ # Blog templates
│ ├── post.html # Blog post detail
│ ├── list.html # Blog post listing
│ └── category.html # Blog category
├── includes/ # Reusable components
│ ├── hero-section.html # Homepage hero
│ ├── features-grid.html # Feature showcase
│ ├── testimonials.html # Customer testimonials
│ ├── contact-form.html # Contact form
│ └── footer-cta.html # Call-to-action footer
├── css/ # Stylesheets
│ ├── homepage.css # Homepage-specific styles
│ ├── blog.css # Blog styling
│ └── forms.css # Form styling
└── js/ # JavaScript
├── homepage.js # Homepage interactions
├── forms.js # Form functionality
└── blog.js # Blog interactions
```