Getting started with Pimcore
Igor Benko
Lead Dev at Basilicom GmbH
Twitter: @igorbenko
LinkedIn: benkoigor
Pimcore Partner since 2010
Golden Pimcore Partner since 2015
Our business use case?
Project roadmap
Website
Editable text
Editable text
<div class="slider-area">
<div class="single-slider ptb-240 bg-img">
<div class="container">
<div class="slider-content slider-animated-1">
<h1 class="slider-title">Want to stay healthy drink matcha.</h1>
<p>
Lorem ipsum dolor sit amet, consectetu adipisicing elit sedeiu tempor
inci ut labore et dolore magna aliqua.
</p>
<div class="slider-img-container">
<img class="slider-img" src="/img/product/front.jpg" alt="Our product">
</div>
</div>
</div>
</div>
</div>
Editable text
<h1 class="slider-title">Want to stay healthy drink matcha.</h1>
<h1 class="slider-title">{{ pimcore_input('headline') }}</h1>
<h1 class="slider-title">{{ pimcore_input('headline') }}</h1>
Editable text
Editable image
Editable images
<img class="slider-img" src="/img/product/front.jpg" alt="Our product">
{{ pimcore_image('stage-image', {
'class': 'slider-img'
}) }}
Editable image
All possible editables
PIM
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Product Data
Variants and inheritance
Variants and inheritance
Variants and inheritance
Using Data Objects in code
Get product data
Create product programmatically
$product = \Pimcore\Model\DataObject\Product::getByPath('/products/Laptop Pro Gold - 15 inch');
$product->getName();
$product->getEan();
$product->getImageMain();
$product->getColor()->getName();
$product->getColor()->getColorValue();
$product = new \Pimcore\Model\DataObject\Product();
$product->setKey('New Product');
$product->setParentId(1);
$product->setName('Our new product');
$product->setDescription('Some Text');
$product->save();
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
All possible Data Object field types
MDM
Brick and mortar stores
DAM
Upload assets with simple drag and drop
Add metadata
Add metadata
Add metadata
Add metadata
EXIF and IPTC embedded metadata
Use assets in code
Get the URL of the image
Get html of the image tag
$asset = \Pimcore\Model\Asset::getByPath('/laptops/new-photos/laptop-gold.png');
$asset->getFullPath();
$asset->getThumbnail()->getHtml();
/laptops/new-photos/laptop-gold.png
<img alt="Hey Google, this is the best laptop over | © Me" title="This is the best laptop ever | © Me" src="/laptops/new-photos/laptop-gold.png">
Use assets in view code
{{ photo.getThumbnail('product-thumbnail').getHtml()|raw }}
Get html of the thumbnail
{{ photo.getMetadata('copyright') }}
Get metadata
{{ photo.getWidth() }}
{{ photo.getHeight() }}
Get dimensions
{{ photo.getFormat() }}
Get format
Thumbnail pipeline
Source image
Thumbnail pipeline�Resize and change background
Thumbnail pipeline�Crop to size for a banner
Thumbnail pipeline�Set a focal point
Thumbnail pipeline�Crop to size for a banner with a focal point
CMS and PIM
Easy integration
PIM data on the website
Show the data objects in frontend
Retrieve the products to display in the controller
$productSelection = new Product\Listing();
$productSelection->setObjectTypes([
AbstractObject::OBJECT_TYPE_VARIANT,
AbstractObject::OBJECT_TYPE_OBJECT
]);
$this->view->productSelection = $productSelection;
Show the data objects in frontend
Original template HTML
{% for i in 0..3 %}
<div class="product-wrapper">
<div class="product-img">
<a href="product-details.html">
<img alt="" src="/img/product/product-1.jpg">
</a>
</div>
<div class="product-content text-left">
<div class="product-title">
<h4><a href="product-details.html">Product</a></h4>
</div>
<div class="product-price-wrapper">
<span>$100.00</span>
</div>
</div>
</div>
{% endfor %}
Show the data objects in frontend
Template with the real DataObject data
{% for product in productSelection %}
<div class="product-wrapper">
<div class="product-img">
<a href="product-details.html">� {{ product.imageMain.getThumbnail('product-selection').getHtml()|raw }}� </a>
</div>
<div class="product-content text-left">
<div class="product-title">
<h4><a href="product-details.html">{{ product.name }}</a></h4>
</div>
<div class="product-price-wrapper">
<span>{{ product.price|number_format(2, ',', '.') }} €</span>
</div>
</div>
</div>
{% endfor %}
Show the data objects in frontend
Only changes highlighted
{% for product in productSelection %}
<div class="product-wrapper">
<div class="product-img">
<a href="product-details.html">� {{ product.imageMain.getThumbnail('product-selection').getHtml()|raw }}� </a>
</div>
<div class="product-content text-left">
<div class="product-title">
<h4><a href="product-details.html">{{ product.name }}</a></h4>
</div>
<div class="product-price-wrapper">
<span>{{ product.price|number_format(2, ',', '.') }} €</span>
</div>
</div>
</div>
{% endfor %}
Single source of truth
Web2Print
Create PDFs
Use cases:
Technologies:
E-mail & Newsletter
Send E-mail or Newsletter
API
Why and where can we use the API?
Use cases:
Create API Endpoint in Datahub config
Query the GraphQL API
{
getProductListing {
edges {
node {
id,
classname,
key,
ean
}
}
}
}
{
"data": {
"getProductListing": {
"edges": [
{
"node": {
"id": "2",
"classname": "Product",
"key": "Laptop Pro Gold - 15 inch",
"ean": "31234512345"
}
},
{
"node": {
"id": "6",
"classname": "Product",
"key": "Laptop Pro Blue - 15 inch",
"ean": "31234512347"
}
},
{
"node": {
"id": "8",
"classname": "Product",
"key": "Laptop Pro Green - 15 inch",
"ean": "31234512348"
}
},
{
"node": {
"id": "12",
"classname": "Product",
"key": "Laptop Pro Gold - 13 inch",
"ean": "31234512345"
}
},
{
"node": {
"id": "13",
"classname": "Product",
"key": "Laptop Pro Blue - 13 inch",
"ean": "31234512347"
}
},
{
"node": {
"id": "14",
"classname": "Product",
"key": "Laptop Pro Green - 13 inch",
"ean": "31234512348"
}
}
]
}
}
}
API & Headless CMS
Pimtastic Global
www.pimtastic.com
Pimtastic UK
www.best-laptop.co.uk
Pimtastic Italy
www.miglior-laptop.it
Pimtastic Spain
www.melhor-laptop.pt
Pimtastic German
www.bester-laptop.de
System overview
System overview
Website
System overview
Website
Microsites
System overview
Website
Microsites
Web2Print
System overview
Website
Microsites
Web2Print
Newsletter
System overview
Website
Microsites
Web2Print
Newsletter
Mobile App
System overview
Website
Microsites
Web2Print
Newsletter
Mobile App
ERP
System overview
Website
Microsites
Web2Print
Newsletter
Mobile App
ERP
CRM
System overview
Website
Microsites
Web2Print
Newsletter
Mobile App
Digital signage
ERP
CRM
System overview
Website
Microsites
Web2Print
Newsletter
Mobile App
Digital signage
ERP
CRM
Unicorns are real!
What have we achieved today?
THANK YOU!
ANY QUESTIONS?