the broadcast is now starting all attendees are in listen-only mode good afternoon and welcome to today's webinar commerce tools and Magnolia a powerful combination of content and comers I am your moderator Cass Weber from Magnolia in today's lineup we have Hussein bin amor from Commerce tools and Yan Schulte from Magnolia before we formally start I just like to inform everyone that you are free to note down or send in your questions via chat while the presentations are ongoing we have a lot of time for Q&A after the presentations that's in about 30 minutes from now let's start right ahead and get to know Magnolia who we are and what we do here is Magnolia in one minute founded in 1997 here in Basel Switzerland Magnolia is a software company that produces an enterprise content management system that's built for demanding multi-channel multi-language and multi-site digital experience global as we are aside from Basel Switzerland we also have offices in Czech Republic Spain England Miami USA Vietnam and Singapore we are also working together with over 90 partners and 300 customers worldwide as we all know the IT landscape is continuously changing in a rapid pace you cannot afford to be left behind with outdated features Magnolia truly believes that you need the Best of Breed platform to leverage best-in-class solutions and to stay ahead of your competition as we can see in the picture Magnolia allows you to integrate all kinds of solutions like e-commerce marketing platforms it.if allows you to personalize data Magnolia also allows you to publish on any channel let's have a closer look to show how magnolia can help you outperform your competitors Magnolia brings a vast variety of connectors such as what we're having today commerce tools it's light development framework allows your front and experts to bring latest front end technology to create world-class digital experiences in all channels we have been good partners with commerce tools since 2015 and have been serving customer projects for brands such as Bulls Sega trade printed code at UK sim press and Kettler bike this shows you how your data could be headless in mobile tablet and web or even in digital kiosk system Magnolia is the continuous delivery system while or delivery platform rather while commerce tools is the shopping platform to learn more about Magnolia and our latest offering please head over to our corporate website now we're done with Magnolia it's time to get to know commerce tools together let's find out who they are and what they do with Husain benomar thanks guys here is Hussain let me just shortly share my screen casts can you confirm that your show that you are seeing my screen yes ok great and fullscreen motors hi everybody again I'm who say the technical trainer at commerce tools what we provide is an omni-channel API that can be consumed by different programming languages cloud is our default infrastructure and since we work in an agile methodology we are able to release a lot of features yearly a project in our platform can be managed through our Merchant Center that you will see later in a few minutes we provide you with different tools and SDKs that help you creating yourself and your shop looks basically like this is our demo shop here we have two versions one browser version and a mobile app here is an overview of our features but today I'll talk only about products product variants in prices these are the functionalities that you will see later in our Magnolias integration let's start with products the product in our platform can have different states you can move a product from live to staging and vice versa anytime just by publishing or unpublishing products the product in our platform can have several variants in this example a different variant is a different color the master variant is the only is usually the one used to this to be displayed in search results and every variant includes information about the product like images different prices etc I just mentioned that a product variant can have several prices these are based on different dimensions for example an article can have a different price in Germany than in the UK or it can have a different price within a certain period of time and here is another overview that shows you a product as a container that includes several variants represented here as colored boxes where every box carries different information for further information just check our developer page and you can also see our feature guide now let's jump to to our Merchant Center to see some some action you can reach our Center under merchants enter commercials calm our Merchant Center helps you with managing your variant your various shop data when I'm on the correct project I can check the list of our products like here for example when I click on one product I can see the different variants of a product here and when I click on one variant I can see the different information related to that variant for example here different attributes like size color etc I can check out the different images in prices and as we said earlier prices are based on different dimensions like in this case currency country customer group etc I now pass to young who will use these data together with front-end data from a magnolia project to show you a demo shop ok perfect let me share my screen mm-hmm so guess can you make me presenter please young you're already presenter we can see perfect awesome okay here we go so um what we see here is Magnolia so if you know how to operate a tablet system then you almost know how to operate Magnolia we have an app for every piece of core functionality we have pages for those pages assets to work with images and videos we have apps for products for Co aspects and much more today we're just going to talk about pages and about commerce what we see here are two sides we have a commercial side and we have the sunrise shop the sunrise shop is totally based on the standard templates that you already know from this then not sunrise demo if you look at it here then we see the plates every probably or now so we have here then the teasers and we have product data if I want to change it to user I just have to click on edit and if I change some text for example here let's do it a little bit Twitter style let's save it and here it is instantly changed we also can work with extra data like for example tracking so we can assign cookies or other information if a certain teaser is triggered if we want to work with data from commerce tools then we have a very nice integration here all those products that we see here comes straight from commerce tools so this data is not stored in Magnolia it comes via the API is in real time for example if I want to change this product here again I just have to click on edit and now I see the full product catalog from commerce tools delivered in real time so if I change justice t-shirt here that one sack here it is so let's create a full campaign site in a few minutes therefore I'm just going to create a brand new page I'm going to select here the home page template and this going to be our campaign here it is an empty page so let's say we got some nice material from our marketing team and also some nice product data so the first task would be just to get the asset data straight to Magnolia therefore I'm going to jump to our assets F assets app is an app where all our assets are stored and we also can do some light editing of those assets and when I where I can manage metadata so I have all those images from our marketing team already arm zipped together in this file here so I'm going to upload it I'm going to save it and here it is I just got all those images just from the zip file if that's a 5-wood have a deep our folder structure then that would be also reflected here okay so we have know some nice imagery let's start to work with it first of all I'm just going to create a nice text leaden therefore I'm going to create a text component we start with some lead-in text contrast and it is going to be a become a campaign about um black and white white choose your style we want to have here become phones to make it more snappy let's go really pick that one here look smaller and here we go that's offers component now it's time for some nice teasers so we start with some banners so this is no let's just get this image here straight from our upload let's go with this one if someone clicks that link then you should be redirected to the appropriate page in this case we're just going to send our user to the catalog some text here we just go for filler okay here we go just duplicate that content and let's bring here a nice image from the upload so this is a product that I'm also going to create in commerce tools in a minute and which I'm going to use life and so from that page that we just create and maybe a little bit different text here here it is no it's time for product data from commerce tools so winter is coming let it snow and here we come with the products I'm just going to go for the women section I'm going to look for clothing some dresses and let's go just for a product if someone clicks on this product then he should be sent to the detailed you there we go our first product let's duplicate sirs know we have our products here yeah at the moment we just have to stand up prologue assumes a catalogue but now it's just time to get a new product and then integrate this here therefore I'm just heading over to the Merchant Center and I'm going to create a new product it's quite simple I'm just going to add a product I can't use standard structure for that we keep it a nice name so it's going to be my address all the rest is something that I'm going to them ah we're going to add the categories that we can find it in our category tree with you instead my category tree as you probably know already I just have here campaign category because we just create a new campaign I'm going to edit here so um I guess I was a little bit fast here so we have our campaign that's good and set back to product yes address that looks good let's go next now we're going to add a very end who's going to be our master very end we just give it a fake number for the beginning give it a very end key just get a random one we have a filter caller that looks all nice and good we go next and we are all done but save that ah the base it is obviously missing let's fix this here so here's a base idea and we have all good and that saves us no we would also like just to add a nice image so we can see it in Magnolia and personalized and later on so we can we get an image of fire we go to our folder from the campaign and we just go here for so white dress and here just fine it's uploaded the last step is we just have to publish it from commerce tools so it is available in the catalog right now it's unpublished let's change this here it is not let's head back to Magnolia and select it so it is here in the campaign and here's my dress and here it is just after what was it like two or three minutes I guess it can't be easier than that let's change souls to have it complete and the last one to get a dice page perfect so let's say we also want to sell a second category let's say we want to sell some bags so just another nice teaser it's going to be in bags and the city we're just going to select a nice image for that this time I'm just going to go to thumbnail view subtitle sweet bags and some place feel as well we just go to a sunrise mind edge if we click on the t-zone and here we go what we have seen before was we just placed single products sometimes you would want just to place products based on product category and then filter on later that's also very powerful way to automatically um send products and then personalize them so what I'm going to do now is I'm going to select this component here and now I'm just going for bags not forcing a product let's go for bags Save Changes we are going to display four products per page if I click on a product I want to go straight to the detail view to see what this product actually of us and what it how it looks like and more detail what we have now are just some bags but let's say we have some products on sale or we just want to filter and personalize on a single column very simple all I have to do is just fill it out paste for example on a collar collar let's say we want to look for white products BAM here it is really in no time so now we have just a nice landing page let's have a look at it but what about customization what can we do now with Magnolia so what we can do as we have a Recinos we can do some basic customization based on behavior on and cookies and so on and this what I'm going to do now but obviously you can also use external API from other systems to do more and that person ization if you want to so let's say we have here this component and we want to personalize it so what I'm going to do now is I'm just going to create a variant for that so might have a variant and I'm going to change the image for that variant just going to take this picture here and what I'm going to do now is I'm going to choose an audience so let's say I come from a segment that is looking for content there's more tailored for male people and I'm just going to take some mayor segment I'm going to save my changes and then this page is going to I'm presented for people with set um category what we've seen was that we have sub X here that are filtered for white let's change this here a little bit just to show you what categories and colonization we can bring to you we're just going to remove that one Save Changes again a component variant and now we are going to just show the white backs if we know that the user isn't a segment that is somehow interested for products that are more no white flavor it saves this one pick no we're going to make sure that we have the right filter attributes again here Save Changes here it is so now we have somehow a customized page but how can a market here really know how it looks like for the different segments was a different personas quite simple all I have to do is just to preview the page and preview as a visitor what I see now here is just a page as an anonymous user that means that is a user that's for which we have any information yet but let's say we have know some cookies or the user locked in if I just come for example of set segment here bomb here it is that's just a mere version what is happening if we just come here this is caller preferences here we go nice so how do we do this for that in Magnolia we have dedicated apps like pages and ezard's and what we can do here is we can we just go to a segments and in the segments we can just create all kinds of segments based on all kind of different technical data for example if I create a new segment here picked rate then I can just for example personalized based on the date on the ons location with user comes from we can look if it's a first time visit or reoccurring Vista login visit or we can just do it with cookies or a set we can just tap into all kind of short party personalized data its we a simple at that okay and we've set we have seen that we can personalize and create a page and we leave few minutes and therefore I would hand it over to Cass again alright so we just saw how easy it is to personalize content in minutes thanks to commerce tools and Magnolia collaboration while you get your questions ready I'll just give you a quick recap of some highlights during the presentations first is that personalization can be done in no time that was pretty obvious we saw how quick yon did it for us second seamless integration of Commerce and content and that the editorial experience is really really simple and easy alright all set you may start directing your questions now and we'll have Hussein and Yan answer them general questions that questions fire them Oh way let's have one here when I create too many products on the Commerce Tools platform let's say thousands do these products appear immediately in magnolia or how much time does does it take usually once we hit the publish button in commerce tools you should have it in seconds available in magnolia that's really the beauty you don't need long processes or your IP T Department in between it's really instantly without any involved how is the product data that we have seen in the demo rendered yes good question therefore we have a mechanism that is called light development in the end the full front and can be really developed by a pure front-end developer all that developer really has to know is how to obviously write HTML CSS JavaScript and all that the front-end developer really has to know is just how to take say existing HTML prototype and put it into magnolias free market em plating language that is typically something that takes like maybe one day and then we provide some standard functions that you can use in the pre-market templates to really just get the product data and then your templates you can just really say okay for this product to give me surprise give me a headline give me the image give me the variance it's really simple we have here from Shailendra Sawant hi Ann is there an option of auto publishing or pre publishing products for future events yes absolutely so what you can do in Magnolia is you can just take a page as this let's let me show this to you and we just created here our campaign but obviously it's not published yet so if I want to publish it on a certain date all I have to do is really just to hit publish and once I do so then I can really select the date when it should be life and I couldn't do all the same for unpublishing I can also say is that a page should be unpublished on a certain date it's really simple I also have one from amia Joshi please excuse me if I'm mispronouncing your names how do we create products project pages dynamically using code I think thats related to your second explanation or do you want to elaborate more than that one Yong yes so if you want to solve dynamic products then you can do it like I have shown before you can just really throw products from certain categories and then you can automatically filter their own based on attributes that are stored within the product that could be anything from cholera sighs is it on sale price whatever I can really do this totally data-driven and even if I want to go further what I have showed was just static so I just pre-configured what kind of product data should be filtered you could even do use some nice algorithms - based on the user journey make sure that the right products are presented to the user now what happens in Magnolia if a reference product is unpublished in commerce tools that's from meals Hardman very good question so if your templates are not good then you're going to get an error message but your templates are going to be good and therefore and your templates you're just going to check if the reference really holds true so we have API call that checks for this product if the API call just sending back the result okay there's no product anymore than this product is simply not compute it's not going to be displayed however what you can do in your component for example is you can specify for all that products that are then showed on the page instead I have a good one here how do you handle multi-site multi-language shops from me I'll beautifully good yeah so in Magnolia you can we have a very nice concept for multilanguage that means you can manage all the languages straight on your on your page so that means you can just go on a page and then switch between the languages and do the translations straight on the page if you want to you can also use something that we call a multi language or multi language we approach where you have all the languages in different nodes that make sense if you have really specific content and if you want to have multiple shops that inherit like 80% of the content and we have a nice feature that is called our life copy with life copy you can just really create your main your master content or you can just reference your master content multiple times and then you just overwrite the components that are specific for your store so that really helps you to create new stores in new countries or new towns in no time it's good I have one for Husain are you there commerce can you ship a list of products in a cart to various ship to addresses that's from yeah cool Milo Becky yeah thanks checker folder for the question currently cards support only one shipping address so basically if you put list of products in one card you can ship only to one address all right from Landrus I want if I have an existing back-end can we plug and play the Magnolia CMS where the back-end system or products are fetched from there is tightly bound to its back-end system yes I guess a question goes into the direction if if you have an existing system that delivers content if it's possible just to argument content from your existing system so yes you can also use Magnolia in a headless fashion that means you can bring teasers panels or previa not products to the existing system and obviously can also do it by Peraza you can also deliver data from your back-end system to Magnolia and then take this data and render it so both ways are impossible I have one more how our Magnolia and commerce is connected together and how does Magnolia get data from commerce tools yes so the connection is purely done via our rest services that means Commerce tool is able to deliver the data as a rest call in a very high speed and Magnolia is just going to takes a rest data and allows you to browse the catalog or even just takes a propagate and render it so it's really just pure rest Thank You Danielle butcher for that question by the way how do we define various discount dynamically and various products based on their position in the cart I guess that's for Hussein yeah let me try to understand the question quickly how to define various discount dynamically on various products based on their position in the cart yeah basically for discounts we offer cart discounts so you can when you have a cart you can add their cart discount and inside the cart discount you can specify using what we call rules or predicates you can set which products are affected by that discount I hope that answered your question otherwise just try to ask it differently yeah also my site there are multiple API is for for discounts and certain rules and what we can see here for example is just a standard price but for this component we could all see also ask for the discounted price so the api's are there and you can use them all to the front and obviously on the house in the back end okay can magnolia work multi-site yes absolutely yes domains and have two separate themes to them absolutely again just alright that's from amia joshi how can you manage rich content from online catalog and/or social media apps yes that's a good question so i'm how can i bring it all together so basically the four products or product categories the discounts all the stuff is managed in Reverse tools in magnolia you just manage the pure custom experience what you do in Magnolia is you can really just bring different components mix it with the content from commerce tools and obviously you can also mix it with social media data so you can have it on a very light level that would mean that you just have the typical Facebook and Pinterest and so on buttons to share your content or I can even come up with Twitter feeds so you can really max that out that's a nice thing with mocking oh yeah it's super simple to come up with your own components that really leverage all the api's and the good stuff from the other social media vendors it out there Thank You Dennis Menendez for that good question I have one here how is the publishing workflow like yep good question again from the publishing workflow does the box is just a for i4i workflow that means if I try to publish a page then office box you also need a review as it really looks if the content is good as any spelling mistakes or if it really the content that you requested and then that guy can gives you a final goal and then the content is published however we have a full-power jbpm engine behind Magnolia and that means that you can craft the publishing workflow as you want it could be very simple like direct publish or super complicated with let's say for tonigh workflow with public with translation leader marketing and so on they can really just crafts workflow like you needed for your business here is from Giancarlo burner how do you build a checkout process and manage client orders yeah good question again so you can basically builds a checkout process right in magnolia you can use standard templates for that you can you see if for module for that from Magnolia or like some customers - you can even write very nice angular for that to have a very snappy checkout experience for a customer and the good thing is because it's also template based Magnolia you can then come up with additional personalized content during the checkout for example you could send some teasers based on some statistics could be like okay um you just bought two white dresses and based from our other customers we know if you buyer buys this dress and the chances are quite highs that you're also interested in the into a third product and then you can just tease this product also in the checkout process so just to summarize that yeah you're just going to build this checkout process straight in Magnolia with standard templates in connection to that how our payment providers integrated just payment that's for I see also a related question from a male he or she asked about how is the card session managed Magnolia commercials that's absolutely managed on commerce tools also related question from from Messiah Beulah if you check out payment handled by Magnolia commercials that's also handled by commerce tools and the second question also from missional is how our payment providers integrated so payment can be basically payment can be handled by commerce tools directly means you implement your integration from any payment service let's say for example you know like credit card or any other online payment service and what we store on on the commercials by platform are just the transactions or the transaction states but of course all your payment information should be on your payment provider I saw further question about card session from Amaya I guess it that's basically the same question than before probably a Shailendra discount question oh yeah elaborate yeah just give me a few seconds to say so Chandra is asking there I have five products in my cart I need to give a discount of 10% for every third item in the cart and a 50% discount on the tenth item can such complicated rule be defined also can rules be applied at a long time programmatically instead of defining them in advanced so basically rules I start with the last question then come back to the 2d to the special case basically rules can be should be defined in advance but of course you can also change them I mean on commercials everything is based its API based that means you can also update the discount any time return into that case the rules on commercials can be very complex that means you can write radio long cruel and and define everything you want not only based on the value of the discount and which product but also you can apply apply it to for example to a certain category of discounts or to a certain customer or customer group and you can add all the in one long rule if you want and of course you can also create several card discounts and apply them to that card I see another question from Kyle Andra asking how our online promotions managed like based on an even sending promotion email to set of users promotion are what we call the commercials platform a discount code and those are related to card discount so basically you define your your promotion or your discount code and then you can send it to users per email you can of course also give it to to two users like you know some companies give this on the street and so on but basically there you just define your promotion code inside the discount code and you apply it to a card discount I hope that answers your question salindra otherwise of course you can manifest yourself okay thank you all right I got one directed to yon how is the price election done is it aware of customer groups countries channels and so on that is from Julius Salah be more for me right or yeah feel free yeah this is more actually so prices handout on the commercial side a price selection as I said and also as question says it's based on different dimensions that I showed earlier maybe quickly in the slides but don't worry we will send you the slides after the webinar and basically yes so based on the information of the customer so in which country is the customer of course we get that information from from from his or her dress for example based on the customer group of the customer the currency that customer uses and different other dimensions also for example a validation period you can set the price for a certain to be valid for a certain period let's say for example Christmas and then a price selector on the commercial side will select the the correct price goes from the list of prices inside the that product or that product period and then after the selection that price will just be applied in your account so yeah see important formation years definitely your commerce team is going to manage all those rules for the writers counts and so on that is not something that the the author is going to do perhaps a clarification can you push module II assets to commerce tools and not vice versa that is a good question however I'm not quite sure why I would do this because normally you just have all the product data in your catalog like different peg shots and all that stuff and then you're just going to send it to the front end therefore I don't know why it would make sense to push images from Magnolia to armor stools I think in theory if you really want to be an API it could be possible definitely but at least right now I haven't seen a request for that until now ok I see there a question for me from Chandra asking for online promotions the question says for online promotions is there a way to get notification back as to who all read the promotions and to track the efficiency of promotion can we find out if those users purchased the product that's a good question actually and the answer is not really obvious so there is no direct way but we we offer the ability to be to extend to extend the customer object where you can add a custom field and there may be you can add the field for used promotions and then add the promotion every time it is used by that customer I see that as let's say as a workaround so as I said it's not yeah it's not offered by by default that feature but you can you can implement it easily just by adding a custom field to customers and yeah how does Magnolia and commercials manage mobile content rendering speed consistently where bandwidth spans LTE to 3G that's from Dennis minutes good question yeah so if it comes to images we have a mechanism that is called renditions that mean typically you just get very big images from your agency and then you upload them to Magnolia and obviously you're not going to use a 27 megabyte image to brings us to your customers therefore you can automatically create smaller versions of that image and then based on your template you just choose the right variation for the right channel it comes to mobiles and most people nowadays just use responsive templates for that but if you want to you can also come up with specific templates for mobile and for desktop somebody's also asking related to image renditions how is it handled this time in commerce tools are there possibilities of cropping or scaling there is no possibility of cropping or scaling on the commerce tools part but you can add different images for for one article or for one product variant and of course there you can just upload different images with different scales and name them differently or yeah them different sizes and then you can use them so I think that that's that's possible but also not directly from the commercial side yep and again I said you can do this in Magnolia so we have some some molecular mechanisms there to do stuff like resizing scaling and also auto cropping so basically um you decide in your templates when you create your templates how they can image should be so what you do for example if we jump back to the page that we have seen then you could really say ok if I am going to place an image here in this Jesus components and it has to be always to be an aspect ratio from 4 to 3 and this is that resolution and that Magnolia automatic is going to take care that you gets an image in the right resolution for the right channel in the right aspect ratio and if you want you can also extend the channel's mechanism for example automatically bring watermarks to your images so it's very powerful is there any provision for displaying a widget with user preferred products based on their buying history or viewing history I guess that's for sane yeah absolutely so basically we don't save this kind of information about customers but as I said previously when I answered one of the questions customer the customer object can be extended by any number of custom fields and there you can save the history of the customer for example or all the view history and so on so for that there is also an easy walk around and also on Magnolia site you can track the user journey with different analytics tools like Google Analytics on the Chara or with IBM marketing cloud and then just create variations and presentation based on the user behavior on the page great thank you very much going back to personalization what kind of data can be used for personalization good question so in the end you can use any data that is available with a standard API in Magnolia so what we've seen here with those segments when I clicked on picked rate and we just had users forest and not rates obviously when we created this framework we cannot know what kind of systems our customers going to use because as we did quite an incredible amount of systems out there however we created a very nice framework that makes it super easy to integrate your existing systems so let's say if you have a good CRM system then you can just tap into the CRM system and really see how I interacted with the company what I have done so there is a very good example that was done quite often or another examples will use this marketing automation tools that are out there so what you can do is you can really apply for example scoring on different pages and then based on those and then just deliver personalization personalized content based on the Squa metals that you get from your party systems ok we don't have any open questions left probably in general if you want to clarify something both yawn and Husayn feel free who goes first let's say from my side if you have any further questions also I know sometimes questions come just after the webinar you will get my contact just send me an email if you have any questions sounds good alright it's time to wrap it up we would like to thank commerce tools for the efforts Magnolia team you our audience of course our customers and partners thank you that's it for today's webinar until next time have a great day ahead thank you all for attending ciao ciao