Rahul Joshi 7 Years Ago I cannot find the Aspect Ratio Field. Can you please guide where it is located? Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 7 Years Ago Hi Rahul,You need to create this field in your own structure. Please check my structure json file. Please sign in to reply. Reply as... Cancel Rahul Joshi Neil Jin 7 Years Ago Sure, I will check that. I guess that would give more details. Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 7 Years Ago Yes, that's is a workable source code for the structure. Please sign in to reply. Reply as... Cancel Nitin Dwivedi Neil Jin 2 Years Ago - Edited Hi Neil the upper link is not working, and i have tried same that you wrote but its not working my slider buttons is visible and images are show in vertically. Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 7 Years Ago Actually the Aspect Ratio Field is just a text field. Please sign in to reply. Reply as... Cancel Rahul Joshi Neil Jin 7 Years Ago Can you help me with one more thing? If I need to link an image with a blog post or news article in Liferay. How can I do that? Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 6 Years Ago Then you can add the link in the structure and html in template accordingly. Please sign in to reply. Reply as... Cancel Christian Pätzold Neil Jin 6 Years Ago Actualy there is a little bug in your template. In data-target you forgot a # ;)wrong:<li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='carousel-<@portlet.namespace />'></li>right: <li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='#carousel-<@portlet.namespace />'></li> Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago In my case I used "${.vars['reserved-article-id'].data}" instead of "<@portlet.namespace />"You can find the structure in the Javascript field. Template is in the css and html field.<script async src="//jsfiddle.net/rhg7o359/embed/"></script> Please sign in to reply. Reply as... Cancel Christian Pätzold Christian Pätzold 6 Years Ago Sorry, this is the link: https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago You can find the structure in the Javascript field. Template is in the css and html field.https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Neil Jin Christian Pätzold 6 Years Ago Hi Christian, Thanks for pointing that out!I think using ${.vars['reserved-article-id'].data} may cause duplicated id if you add 2 web-content-display portlet to the same page with the same web content. Uisng portlet namespace can gurantee the id is unique in the page.For the name space, you can use <@portlet.namespace /> or ${request.get("portlet-namespace")} or ${request["portlet-namespace"]} depends on what version of Liferay you are using. Please sign in to reply. Reply as... Cancel Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Neil Jin Rahul Joshi 7 Years Ago Hi Rahul,You need to create this field in your own structure. Please check my structure json file. Please sign in to reply. Reply as... Cancel Rahul Joshi Neil Jin 7 Years Ago Sure, I will check that. I guess that would give more details. Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 7 Years Ago Yes, that's is a workable source code for the structure. Please sign in to reply. Reply as... Cancel Nitin Dwivedi Neil Jin 2 Years Ago - Edited Hi Neil the upper link is not working, and i have tried same that you wrote but its not working my slider buttons is visible and images are show in vertically. Please sign in to reply. Reply as... Cancel
Rahul Joshi Neil Jin 7 Years Ago Sure, I will check that. I guess that would give more details. Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 7 Years Ago Yes, that's is a workable source code for the structure. Please sign in to reply. Reply as... Cancel Nitin Dwivedi Neil Jin 2 Years Ago - Edited Hi Neil the upper link is not working, and i have tried same that you wrote but its not working my slider buttons is visible and images are show in vertically. Please sign in to reply. Reply as... Cancel
Neil Jin Rahul Joshi 7 Years Ago Yes, that's is a workable source code for the structure. Please sign in to reply. Reply as... Cancel Nitin Dwivedi Neil Jin 2 Years Ago - Edited Hi Neil the upper link is not working, and i have tried same that you wrote but its not working my slider buttons is visible and images are show in vertically. Please sign in to reply. Reply as... Cancel
Nitin Dwivedi Neil Jin 2 Years Ago - Edited Hi Neil the upper link is not working, and i have tried same that you wrote but its not working my slider buttons is visible and images are show in vertically. Please sign in to reply. Reply as... Cancel
Neil Jin Rahul Joshi 7 Years Ago Actually the Aspect Ratio Field is just a text field. Please sign in to reply. Reply as... Cancel Rahul Joshi Neil Jin 7 Years Ago Can you help me with one more thing? If I need to link an image with a blog post or news article in Liferay. How can I do that? Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 6 Years Ago Then you can add the link in the structure and html in template accordingly. Please sign in to reply. Reply as... Cancel Christian Pätzold Neil Jin 6 Years Ago Actualy there is a little bug in your template. In data-target you forgot a # ;)wrong:<li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='carousel-<@portlet.namespace />'></li>right: <li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='#carousel-<@portlet.namespace />'></li> Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago In my case I used "${.vars['reserved-article-id'].data}" instead of "<@portlet.namespace />"You can find the structure in the Javascript field. Template is in the css and html field.<script async src="//jsfiddle.net/rhg7o359/embed/"></script> Please sign in to reply. Reply as... Cancel Christian Pätzold Christian Pätzold 6 Years Ago Sorry, this is the link: https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago You can find the structure in the Javascript field. Template is in the css and html field.https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Neil Jin Christian Pätzold 6 Years Ago Hi Christian, Thanks for pointing that out!I think using ${.vars['reserved-article-id'].data} may cause duplicated id if you add 2 web-content-display portlet to the same page with the same web content. Uisng portlet namespace can gurantee the id is unique in the page.For the name space, you can use <@portlet.namespace /> or ${request.get("portlet-namespace")} or ${request["portlet-namespace"]} depends on what version of Liferay you are using. Please sign in to reply. Reply as... Cancel Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Rahul Joshi Neil Jin 7 Years Ago Can you help me with one more thing? If I need to link an image with a blog post or news article in Liferay. How can I do that? Please sign in to reply. Reply as... Cancel Neil Jin Rahul Joshi 6 Years Ago Then you can add the link in the structure and html in template accordingly. Please sign in to reply. Reply as... Cancel Christian Pätzold Neil Jin 6 Years Ago Actualy there is a little bug in your template. In data-target you forgot a # ;)wrong:<li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='carousel-<@portlet.namespace />'></li>right: <li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='#carousel-<@portlet.namespace />'></li> Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago In my case I used "${.vars['reserved-article-id'].data}" instead of "<@portlet.namespace />"You can find the structure in the Javascript field. Template is in the css and html field.<script async src="//jsfiddle.net/rhg7o359/embed/"></script> Please sign in to reply. Reply as... Cancel Christian Pätzold Christian Pätzold 6 Years Ago Sorry, this is the link: https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Christian Pätzold Rahul Joshi 6 Years Ago You can find the structure in the Javascript field. Template is in the css and html field.https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Neil Jin Christian Pätzold 6 Years Ago Hi Christian, Thanks for pointing that out!I think using ${.vars['reserved-article-id'].data} may cause duplicated id if you add 2 web-content-display portlet to the same page with the same web content. Uisng portlet namespace can gurantee the id is unique in the page.For the name space, you can use <@portlet.namespace /> or ${request.get("portlet-namespace")} or ${request["portlet-namespace"]} depends on what version of Liferay you are using. Please sign in to reply. Reply as... Cancel Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Neil Jin Rahul Joshi 6 Years Ago Then you can add the link in the structure and html in template accordingly. Please sign in to reply. Reply as... Cancel Christian Pätzold Neil Jin 6 Years Ago Actualy there is a little bug in your template. In data-target you forgot a # ;)wrong:<li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='carousel-<@portlet.namespace />'></li>right: <li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='#carousel-<@portlet.namespace />'></li> Please sign in to reply. Reply as... Cancel
Christian Pätzold Neil Jin 6 Years Ago Actualy there is a little bug in your template. In data-target you forgot a # ;)wrong:<li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='carousel-<@portlet.namespace />'></li>right: <li class="${(cur_img?counter == 1)?then('active', '')}" data-slide-to="${(cur_img?counter == 1)?then(0, (cur_img?counter - 1))}" data-target='#carousel-<@portlet.namespace />'></li> Please sign in to reply. Reply as... Cancel
Christian Pätzold Rahul Joshi 6 Years Ago In my case I used "${.vars['reserved-article-id'].data}" instead of "<@portlet.namespace />"You can find the structure in the Javascript field. Template is in the css and html field.<script async src="//jsfiddle.net/rhg7o359/embed/"></script> Please sign in to reply. Reply as... Cancel Christian Pätzold Christian Pätzold 6 Years Ago Sorry, this is the link: https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel
Christian Pätzold Christian Pätzold 6 Years Ago Sorry, this is the link: https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel
Christian Pätzold Rahul Joshi 6 Years Ago You can find the structure in the Javascript field. Template is in the css and html field.https://jsfiddle.net/rhg7o359/ Please sign in to reply. Reply as... Cancel Neil Jin Christian Pätzold 6 Years Ago Hi Christian, Thanks for pointing that out!I think using ${.vars['reserved-article-id'].data} may cause duplicated id if you add 2 web-content-display portlet to the same page with the same web content. Uisng portlet namespace can gurantee the id is unique in the page.For the name space, you can use <@portlet.namespace /> or ${request.get("portlet-namespace")} or ${request["portlet-namespace"]} depends on what version of Liferay you are using. Please sign in to reply. Reply as... Cancel Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Neil Jin Christian Pätzold 6 Years Ago Hi Christian, Thanks for pointing that out!I think using ${.vars['reserved-article-id'].data} may cause duplicated id if you add 2 web-content-display portlet to the same page with the same web content. Uisng portlet namespace can gurantee the id is unique in the page.For the name space, you can use <@portlet.namespace /> or ${request.get("portlet-namespace")} or ${request["portlet-namespace"]} depends on what version of Liferay you are using. Please sign in to reply. Reply as... Cancel Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Marta Santos Neil Jin 5 Years Ago Hello, I am using Liferay version 7.1.1 CE GA2 and none of these alternatives to get namespace work for me. There is any other way to do this? So that I can have two carousels in the same page.... Thank you. Please sign in to reply. Reply as... Cancel
Taruchit Goyal 5 Years Ago Hello, I used the carousel code in Liferay 7, and it worked properly. Then, I used it in Liferay 7.1, then, the carousel was not seen. Rather, all images selected in the webcontent, appeared like a vertical list. At the end of last image, two images were seen "<>" (coming from glyphicon). Please suggest how to make the code compatible with Liferay 7.1; and the points to be kept while writing structure & template for the new version. Please sign in to reply. Reply as... Cancel
Taruchit Goyal 5 Years Ago Hello All, Following up on my previous post, I got following document sharing about creating carousel in Liferay 7.1: https://dev.liferay.com/de/discover/portal/-/knowledge_base/7-1/adt-example The carousel works properly, however, I am unable to add anchor tag, aspect ratio to the images in carousel. Thus, please help to add such properties to the images in carousel. Please sign in to reply. Reply as... Cancel Jason Chee Taruchit Goyal 5 Years Ago This ADT carousel is not that good. Have you figured out how to use the Bootstrap sample from this blog in 7.1? Please sign in to reply. Reply as... Cancel Jason Chee Taruchit Goyal 5 Years Ago For those who has problem running this code in 7.1, I found the missing bit. The class "item" needs to be changed to "carousel-item". Please sign in to reply. Reply as... Cancel Taruchit Goyal Jason Chee 4 Years Ago Hello Jason, Thank you for sharing the change in class name for carousel. The new class "carousel-item" works properly. When we use above structure-template for multiple webcontents on same page, it causes issue due to same id. Thus, we need to create multiple templates and then use unique ids in each. Can you suggest a better method to resolve the issue and help to create new ids dynamically? Please sign in to reply. Reply as... Cancel Prerna Tikhile Jason Chee 3 Years Ago - Edited Hi, After adding this the slide show is working but still those arrows are coming down .Also please suggest how can we change the color of the arrow and add background color as a box to it.And how can we add text on the image.Thanks Please sign in to reply. Reply as... Cancel
Jason Chee Taruchit Goyal 5 Years Ago This ADT carousel is not that good. Have you figured out how to use the Bootstrap sample from this blog in 7.1? Please sign in to reply. Reply as... Cancel
Jason Chee Taruchit Goyal 5 Years Ago For those who has problem running this code in 7.1, I found the missing bit. The class "item" needs to be changed to "carousel-item". Please sign in to reply. Reply as... Cancel Taruchit Goyal Jason Chee 4 Years Ago Hello Jason, Thank you for sharing the change in class name for carousel. The new class "carousel-item" works properly. When we use above structure-template for multiple webcontents on same page, it causes issue due to same id. Thus, we need to create multiple templates and then use unique ids in each. Can you suggest a better method to resolve the issue and help to create new ids dynamically? Please sign in to reply. Reply as... Cancel Prerna Tikhile Jason Chee 3 Years Ago - Edited Hi, After adding this the slide show is working but still those arrows are coming down .Also please suggest how can we change the color of the arrow and add background color as a box to it.And how can we add text on the image.Thanks Please sign in to reply. Reply as... Cancel
Taruchit Goyal Jason Chee 4 Years Ago Hello Jason, Thank you for sharing the change in class name for carousel. The new class "carousel-item" works properly. When we use above structure-template for multiple webcontents on same page, it causes issue due to same id. Thus, we need to create multiple templates and then use unique ids in each. Can you suggest a better method to resolve the issue and help to create new ids dynamically? Please sign in to reply. Reply as... Cancel
Prerna Tikhile Jason Chee 3 Years Ago - Edited Hi, After adding this the slide show is working but still those arrows are coming down .Also please suggest how can we change the color of the arrow and add background color as a box to it.And how can we add text on the image.Thanks Please sign in to reply. Reply as... Cancel