Jack Bakker Vor 11 Jahren Interesting ... I still prefer jquery rotators and continue to include jquery in tomcat*/ROOT/html/js/jquery and then reference in theme; other aui tools are certainly VERY attractive ; great that Liferay can support each and more Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen David H Nebinger Jack Bakker Vor 11 Jahren The one thing to keep in mind, Jack, is that Liferay will load AUI anyway (otherwise the portal is not functional). Adding jQuery will result in a larger browser footprint on the client side.Sure you get the effects you're looking for and it will work in your test environment, but end users may balk at the larger memory requirements of their browser w/o understanding why it is needed... Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
David H Nebinger Jack Bakker Vor 11 Jahren The one thing to keep in mind, Jack, is that Liferay will load AUI anyway (otherwise the portal is not functional). Adding jQuery will result in a larger browser footprint on the client side.Sure you get the effects you're looking for and it will work in your test environment, but end users may balk at the larger memory requirements of their browser w/o understanding why it is needed... Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Jack Bakker Vor 11 Jahren David, are you implying that all aui gets loaded with each page hit ? I love aui for many things (yes, love), but also might reference one or more versions of jquery in perhaps one or more themes, but then load jquery addons via Liveray Page level JavaScript 1, 2,3 etc. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen David H Nebinger Jack Bakker Vor 11 Jahren AUI uses selective loading (only loads modules which are used on the page), so it doesn't load everything and the kitchen sink. But you do get the core AUI, just like when you load jQuery you get the jQuery core.I wouldn't recommend using different versions of jQuery (as you are adding more client browser resource requirements), nor would I recommend loading jQuery on a portlet level (by specifying in liferay-portlet.xml, for example).If you are planning to use jQuery in your portlets, I'd stick with a single version of jQuery loaded at the theme level. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
David H Nebinger Jack Bakker Vor 11 Jahren AUI uses selective loading (only loads modules which are used on the page), so it doesn't load everything and the kitchen sink. But you do get the core AUI, just like when you load jQuery you get the jQuery core.I wouldn't recommend using different versions of jQuery (as you are adding more client browser resource requirements), nor would I recommend loading jQuery on a portlet level (by specifying in liferay-portlet.xml, for example).If you are planning to use jQuery in your portlets, I'd stick with a single version of jQuery loaded at the theme level. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Jack Bakker Vor 11 Jahren loading multiple jquery versions is pretty straight forward ; also is load of addons requiring specific versions Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Bradley Wood Vor 11 Jahren Here is a sliding carousel that Robert and I made by using Alloyhttp://codepen.io/randombrad/pen/cDjvB Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Bradley Wood Bradley Wood Luis Mas Vor 11 Jahren It would be great if you add to the sample some text content inside the image for demoing that something like this http://bqworks.com/products/advanced-slider/mixed.html can be done with AlloyUI carousel. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen chirag @ India Vor 10 Jahren Too good Using this i made web-content Carousel.In that we insert only id of web-content & then it display whole content instead of image check it Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen chirag @ India chirag @ India Vor 10 Jahren You can check at http://liferay.medicalassociation.in/home Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen guest Here Vor 10 Jahren Nice tutorial. I'm trying to implement it, and it works fine. Except for the images hyperlinks:- liferay assigns the site path + the provided linkUrl as the hyperlinnk. So if the image has a url (outside the portal), say, www.urlhere.com, liferay gives: www.siteurl.com/www.urlhere.com.How can I go around this problem?Thanks! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani guest Here Vor 10 Jahren Try giving complete url including http in url textbox.So give http://www.urlhere.com instead of www.urlhere.com. It should resolve your problem. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen guest Here Vor 10 Jahren Thank you Tejas, thad did the trick! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Riley Pickerl Vor 10 Jahren On the liferay homepage the carousel is responsive. Do you have the js to do this or is this something that is handled by AUI? Thanks Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Riley Pickerl Vor 10 Jahren Riley, Check this out it is something you are looking for.http://codepen.io/randombrad/pen/cDjvB Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Kiran Yalavali Tejas Kanani Vor 8 Jahren Hi Tejas Kanani,How to add title and description on carousel image slide show in web content .Please help me. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen V D L Vor 10 Jahren hi tejas..i followed your steps exactly..i created structure and tenplate with your code( no chane)..but it is showing only first image ...it is not sliding..sliding bar also not visible...and on left side of top it is displaying this.ageWidth = 600) Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen V D L Vor 10 Jahren sorry tejas... mistake was in copying code.. now it is working fine..thanks for this blog Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani V D L Vor 10 Jahren Glad to know that it helped you. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen siddhant jain Tejas Kanani Vor 10 Jahren its not working in LR 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Marco Moncalvo Vor 10 Jahren For Liferay 6.2 / Responsive Carousel Structure:<root available-locales="es_ES" default-locale="es_ES"> <dynamic-element dataType="string" indexType="" name="activeIndex" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[activeIndex]]> </entry> <entry name="predefinedValue"> <![CDATA[0]]> </entry> <entry name="tip"> <![CDATA[Index of the first visible item of the carousel]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="string" indexType="" name="timeInterval" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[timeInterval]]> </entry> <entry name="predefinedValue"> <![CDATA[0.75]]> </entry> <entry name="tip"> <![CDATA[Interval time in seconds between an item transition.]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="image" fieldNamespace="wcm" indexType="keyword" name="image" readOnly="false" repeatable="true" required="false" showLabel="true" type="wcm-image" width=""> <dynamic-element dataType="string" indexType="keyword" name="linkUrl" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[linkUrl]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[image]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element></root>Template:#set($interval = $timeInterval.Data)#set($activeIndexValue = $activeIndex.Data)<style type="text/css">.aui .carousel { margin-bottom: 0;}.auiCarousel .aui-carousel-item { height: auto; position: relative; display: none;}.auiCarousel .carousel-item img { width: 100%; height: auto;}.auiCarousel .carousel-item-active { display: block;}</style>#set($totalCount = 0)<div class="auiCarousel"> #foreach($imageElement in $image.getSiblings()) <div class="aui-carousel-item"> #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") <a href="$imageElement.linkUrl.Data"> <img src="$imageElement.Data" /> </a> #else <img src="$imageElement.Data" /> #end #set($totalCount = $totalCount + 1) #end </div> #end</div>#if($totalCount > 0)<script>// Defining Carousel Module"YUI().use('aui-carousel', function(Y) { new Y.Carousel({ contentBox: '.auiCarousel', activeIndex: $activeIndexValue, intervalTime: $interval, }).render();});</script>#end Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen (Sie) Vor 10 Jahren [...] AUI Carousel using WebContent Structure/Template - Blog | Liferay [...] Read More Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Aaron Paxson Vor 9 Jahren Hmmm... very odd. The 6.2 code doesn't seem to work. The carousel loads, and I can see the carousel controls changing, but no images show and no link. When doing an inspection, the link the images point to works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Aaron Paxson Aaron Paxson Vor 9 Jahren Nevermind. I used Marco's CSS Style in the template and works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Shahid Khan Vor 9 Jahren If I want to put ‘sequence’ and ‘alternate text’ fields in ImageElementSet then what modifications I need to make here? Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Shahid Khan Vor 9 Jahren I am able to display it after logged in. but this Carousel is not visible for Guest user.Can anybody tell me how to overcome this problem?i tried all basic permissions and settings but still no use Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Sujeet Rai Vor 9 Jahren Hi Tejas,Same issue. href" " not responding.when i am giving link "http://www.google.com" in linkUrl then, that image also disappear. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Sujeet Rai Sujeet Rai Vor 9 Jahren Using Liferay 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Valentin Rabollet Vor 9 Jahren Hi Tejas,I'm a newbie using CE 62 GA2 and I ve created the structure and the template with the scripts above. Suprisingly, the Web Content Display show me this : -------------------------------------#set($imageWidth = $maxImageWidth.Data) #set($imageHeight = $maxImageHeight.Data) #set($imageWidthPx = $imageWidth + "px") #set($imageHeightPx = $imageHeight + "px") #set($interval = $timeInterval.Data) #set($activeIndexValue = $activeIndex.Data) #set($totalCount = 0)#foreach($imageElement in $image.getSiblings()) #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") #else #end #set($totalCount = $totalCount + 1) #end #end#if($totalCount > 0) #end ------------------------------------------------------Did I miss something? Must I load Alloy UI somewhere first?Thanks for your help! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Ved Mishra Vor 7 Jahren can it be responsive ? because i used this one and its not responsive Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen William Sousa Vor 7 Jahren Hey guys, How can I implement this code using Liferay7?There are any example or tutorial for Carousel in Liferay7?Best regards! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Bradley Wood Bradley Wood Luis Mas Vor 11 Jahren It would be great if you add to the sample some text content inside the image for demoing that something like this http://bqworks.com/products/advanced-slider/mixed.html can be done with AlloyUI carousel. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen chirag @ India Vor 10 Jahren Too good Using this i made web-content Carousel.In that we insert only id of web-content & then it display whole content instead of image check it Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen chirag @ India chirag @ India Vor 10 Jahren You can check at http://liferay.medicalassociation.in/home Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen guest Here Vor 10 Jahren Nice tutorial. I'm trying to implement it, and it works fine. Except for the images hyperlinks:- liferay assigns the site path + the provided linkUrl as the hyperlinnk. So if the image has a url (outside the portal), say, www.urlhere.com, liferay gives: www.siteurl.com/www.urlhere.com.How can I go around this problem?Thanks! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani guest Here Vor 10 Jahren Try giving complete url including http in url textbox.So give http://www.urlhere.com instead of www.urlhere.com. It should resolve your problem. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen guest Here Vor 10 Jahren Thank you Tejas, thad did the trick! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Riley Pickerl Vor 10 Jahren On the liferay homepage the carousel is responsive. Do you have the js to do this or is this something that is handled by AUI? Thanks Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Riley Pickerl Vor 10 Jahren Riley, Check this out it is something you are looking for.http://codepen.io/randombrad/pen/cDjvB Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Kiran Yalavali Tejas Kanani Vor 8 Jahren Hi Tejas Kanani,How to add title and description on carousel image slide show in web content .Please help me. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen V D L Vor 10 Jahren hi tejas..i followed your steps exactly..i created structure and tenplate with your code( no chane)..but it is showing only first image ...it is not sliding..sliding bar also not visible...and on left side of top it is displaying this.ageWidth = 600) Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen V D L Vor 10 Jahren sorry tejas... mistake was in copying code.. now it is working fine..thanks for this blog Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani V D L Vor 10 Jahren Glad to know that it helped you. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen siddhant jain Tejas Kanani Vor 10 Jahren its not working in LR 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Marco Moncalvo Vor 10 Jahren For Liferay 6.2 / Responsive Carousel Structure:<root available-locales="es_ES" default-locale="es_ES"> <dynamic-element dataType="string" indexType="" name="activeIndex" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[activeIndex]]> </entry> <entry name="predefinedValue"> <![CDATA[0]]> </entry> <entry name="tip"> <![CDATA[Index of the first visible item of the carousel]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="string" indexType="" name="timeInterval" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[timeInterval]]> </entry> <entry name="predefinedValue"> <![CDATA[0.75]]> </entry> <entry name="tip"> <![CDATA[Interval time in seconds between an item transition.]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="image" fieldNamespace="wcm" indexType="keyword" name="image" readOnly="false" repeatable="true" required="false" showLabel="true" type="wcm-image" width=""> <dynamic-element dataType="string" indexType="keyword" name="linkUrl" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[linkUrl]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[image]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element></root>Template:#set($interval = $timeInterval.Data)#set($activeIndexValue = $activeIndex.Data)<style type="text/css">.aui .carousel { margin-bottom: 0;}.auiCarousel .aui-carousel-item { height: auto; position: relative; display: none;}.auiCarousel .carousel-item img { width: 100%; height: auto;}.auiCarousel .carousel-item-active { display: block;}</style>#set($totalCount = 0)<div class="auiCarousel"> #foreach($imageElement in $image.getSiblings()) <div class="aui-carousel-item"> #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") <a href="$imageElement.linkUrl.Data"> <img src="$imageElement.Data" /> </a> #else <img src="$imageElement.Data" /> #end #set($totalCount = $totalCount + 1) #end </div> #end</div>#if($totalCount > 0)<script>// Defining Carousel Module"YUI().use('aui-carousel', function(Y) { new Y.Carousel({ contentBox: '.auiCarousel', activeIndex: $activeIndexValue, intervalTime: $interval, }).render();});</script>#end Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen (Sie) Vor 10 Jahren [...] AUI Carousel using WebContent Structure/Template - Blog | Liferay [...] Read More Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Aaron Paxson Vor 9 Jahren Hmmm... very odd. The 6.2 code doesn't seem to work. The carousel loads, and I can see the carousel controls changing, but no images show and no link. When doing an inspection, the link the images point to works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Aaron Paxson Aaron Paxson Vor 9 Jahren Nevermind. I used Marco's CSS Style in the template and works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Shahid Khan Vor 9 Jahren If I want to put ‘sequence’ and ‘alternate text’ fields in ImageElementSet then what modifications I need to make here? Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Shahid Khan Vor 9 Jahren I am able to display it after logged in. but this Carousel is not visible for Guest user.Can anybody tell me how to overcome this problem?i tried all basic permissions and settings but still no use Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Sujeet Rai Vor 9 Jahren Hi Tejas,Same issue. href" " not responding.when i am giving link "http://www.google.com" in linkUrl then, that image also disappear. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Sujeet Rai Sujeet Rai Vor 9 Jahren Using Liferay 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Valentin Rabollet Vor 9 Jahren Hi Tejas,I'm a newbie using CE 62 GA2 and I ve created the structure and the template with the scripts above. Suprisingly, the Web Content Display show me this : -------------------------------------#set($imageWidth = $maxImageWidth.Data) #set($imageHeight = $maxImageHeight.Data) #set($imageWidthPx = $imageWidth + "px") #set($imageHeightPx = $imageHeight + "px") #set($interval = $timeInterval.Data) #set($activeIndexValue = $activeIndex.Data) #set($totalCount = 0)#foreach($imageElement in $image.getSiblings()) #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") #else #end #set($totalCount = $totalCount + 1) #end #end#if($totalCount > 0) #end ------------------------------------------------------Did I miss something? Must I load Alloy UI somewhere first?Thanks for your help! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Ved Mishra Vor 7 Jahren can it be responsive ? because i used this one and its not responsive Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen William Sousa Vor 7 Jahren Hey guys, How can I implement this code using Liferay7?There are any example or tutorial for Carousel in Liferay7?Best regards! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Luis Mas Vor 11 Jahren It would be great if you add to the sample some text content inside the image for demoing that something like this http://bqworks.com/products/advanced-slider/mixed.html can be done with AlloyUI carousel. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
chirag @ India Vor 10 Jahren Too good Using this i made web-content Carousel.In that we insert only id of web-content & then it display whole content instead of image check it Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen chirag @ India chirag @ India Vor 10 Jahren You can check at http://liferay.medicalassociation.in/home Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
chirag @ India chirag @ India Vor 10 Jahren You can check at http://liferay.medicalassociation.in/home Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
guest Here Vor 10 Jahren Nice tutorial. I'm trying to implement it, and it works fine. Except for the images hyperlinks:- liferay assigns the site path + the provided linkUrl as the hyperlinnk. So if the image has a url (outside the portal), say, www.urlhere.com, liferay gives: www.siteurl.com/www.urlhere.com.How can I go around this problem?Thanks! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani guest Here Vor 10 Jahren Try giving complete url including http in url textbox.So give http://www.urlhere.com instead of www.urlhere.com. It should resolve your problem. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Tejas Kanani guest Here Vor 10 Jahren Try giving complete url including http in url textbox.So give http://www.urlhere.com instead of www.urlhere.com. It should resolve your problem. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
guest Here Vor 10 Jahren Thank you Tejas, thad did the trick! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Riley Pickerl Vor 10 Jahren On the liferay homepage the carousel is responsive. Do you have the js to do this or is this something that is handled by AUI? Thanks Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Riley Pickerl Vor 10 Jahren Riley, Check this out it is something you are looking for.http://codepen.io/randombrad/pen/cDjvB Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Kiran Yalavali Tejas Kanani Vor 8 Jahren Hi Tejas Kanani,How to add title and description on carousel image slide show in web content .Please help me. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Tejas Kanani Riley Pickerl Vor 10 Jahren Riley, Check this out it is something you are looking for.http://codepen.io/randombrad/pen/cDjvB Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Kiran Yalavali Tejas Kanani Vor 8 Jahren Hi Tejas Kanani,How to add title and description on carousel image slide show in web content .Please help me. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Kiran Yalavali Tejas Kanani Vor 8 Jahren Hi Tejas Kanani,How to add title and description on carousel image slide show in web content .Please help me. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
V D L Vor 10 Jahren hi tejas..i followed your steps exactly..i created structure and tenplate with your code( no chane)..but it is showing only first image ...it is not sliding..sliding bar also not visible...and on left side of top it is displaying this.ageWidth = 600) Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
V D L Vor 10 Jahren sorry tejas... mistake was in copying code.. now it is working fine..thanks for this blog Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani V D L Vor 10 Jahren Glad to know that it helped you. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen siddhant jain Tejas Kanani Vor 10 Jahren its not working in LR 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Tejas Kanani V D L Vor 10 Jahren Glad to know that it helped you. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen siddhant jain Tejas Kanani Vor 10 Jahren its not working in LR 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
siddhant jain Tejas Kanani Vor 10 Jahren its not working in LR 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Tejas Kanani siddhant jain Vor 10 Jahren Thanks Siddhant for pointing out. I've also attached code for 6.2 now. Try that out, it should work in 6.2. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Philip Teagle Tejas Kanani Vor 10 Jahren Hi Tejas,I am still not able to get this to work in 6.2. Is it required to load the seed and CSS files or is that done by the base 6.2 product? If so, where should this be done? In the web content?<script src="http://cdn.alloyui.com/2.0.0/aui/aui-min.js"></script><link href="http://cdn.alloyui.com/2.0.0/aui-css/css/bootstrap.min.css" rel="stylesheet"></link> Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Tejas Kanani Philip Teagle Vor 10 Jahren Hi Philip,As it's using Alloy UI's Carousel function itself, all required css & js should be there in Liferay 6.2 theme. No need to include any more css & js specific to display carousel. Try by verifying the code with Liferay 6.2 default(Classic) theme. And if you are using your custom theme, make sure it properly loads aui js & css. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Marco Moncalvo Vor 10 Jahren For Liferay 6.2 / Responsive Carousel Structure:<root available-locales="es_ES" default-locale="es_ES"> <dynamic-element dataType="string" indexType="" name="activeIndex" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[activeIndex]]> </entry> <entry name="predefinedValue"> <![CDATA[0]]> </entry> <entry name="tip"> <![CDATA[Index of the first visible item of the carousel]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="string" indexType="" name="timeInterval" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[timeInterval]]> </entry> <entry name="predefinedValue"> <![CDATA[0.75]]> </entry> <entry name="tip"> <![CDATA[Interval time in seconds between an item transition.]]> </entry> </meta-data> </dynamic-element> <dynamic-element dataType="image" fieldNamespace="wcm" indexType="keyword" name="image" readOnly="false" repeatable="true" required="false" showLabel="true" type="wcm-image" width=""> <dynamic-element dataType="string" indexType="keyword" name="linkUrl" readOnly="false" repeatable="false" required="false" showLabel="true" type="text" width="small"> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[linkUrl]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element> <meta-data locale="es_ES"> <entry name="label"> <![CDATA[image]]> </entry> <entry name="predefinedValue"> <![CDATA[]]> </entry> <entry name="tip"> <![CDATA[]]> </entry> </meta-data> </dynamic-element></root>Template:#set($interval = $timeInterval.Data)#set($activeIndexValue = $activeIndex.Data)<style type="text/css">.aui .carousel { margin-bottom: 0;}.auiCarousel .aui-carousel-item { height: auto; position: relative; display: none;}.auiCarousel .carousel-item img { width: 100%; height: auto;}.auiCarousel .carousel-item-active { display: block;}</style>#set($totalCount = 0)<div class="auiCarousel"> #foreach($imageElement in $image.getSiblings()) <div class="aui-carousel-item"> #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") <a href="$imageElement.linkUrl.Data"> <img src="$imageElement.Data" /> </a> #else <img src="$imageElement.Data" /> #end #set($totalCount = $totalCount + 1) #end </div> #end</div>#if($totalCount > 0)<script>// Defining Carousel Module"YUI().use('aui-carousel', function(Y) { new Y.Carousel({ contentBox: '.auiCarousel', activeIndex: $activeIndexValue, intervalTime: $interval, }).render();});</script>#end Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
(Sie) Vor 10 Jahren [...] AUI Carousel using WebContent Structure/Template - Blog | Liferay [...] Read More Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Aaron Paxson Vor 9 Jahren Hmmm... very odd. The 6.2 code doesn't seem to work. The carousel loads, and I can see the carousel controls changing, but no images show and no link. When doing an inspection, the link the images point to works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Aaron Paxson Aaron Paxson Vor 9 Jahren Nevermind. I used Marco's CSS Style in the template and works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Aaron Paxson Aaron Paxson Vor 9 Jahren Nevermind. I used Marco's CSS Style in the template and works fine. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Shahid Khan Vor 9 Jahren If I want to put ‘sequence’ and ‘alternate text’ fields in ImageElementSet then what modifications I need to make here? Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Shahid Khan Vor 9 Jahren I am able to display it after logged in. but this Carousel is not visible for Guest user.Can anybody tell me how to overcome this problem?i tried all basic permissions and settings but still no use Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Sujeet Rai Vor 9 Jahren Hi Tejas,Same issue. href" " not responding.when i am giving link "http://www.google.com" in linkUrl then, that image also disappear. Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen Sujeet Rai Sujeet Rai Vor 9 Jahren Using Liferay 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Sujeet Rai Sujeet Rai Vor 9 Jahren Using Liferay 6.2 Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Valentin Rabollet Vor 9 Jahren Hi Tejas,I'm a newbie using CE 62 GA2 and I ve created the structure and the template with the scripts above. Suprisingly, the Web Content Display show me this : -------------------------------------#set($imageWidth = $maxImageWidth.Data) #set($imageHeight = $maxImageHeight.Data) #set($imageWidthPx = $imageWidth + "px") #set($imageHeightPx = $imageHeight + "px") #set($interval = $timeInterval.Data) #set($activeIndexValue = $activeIndex.Data) #set($totalCount = 0)#foreach($imageElement in $image.getSiblings()) #if($imageElement.getData() != "") #if($imageElement.linkUrl.getData() != "") #else #end #set($totalCount = $totalCount + 1) #end #end#if($totalCount > 0) #end ------------------------------------------------------Did I miss something? Must I load Alloy UI somewhere first?Thanks for your help! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Ved Mishra Vor 7 Jahren can it be responsive ? because i used this one and its not responsive Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
Mohamed Sayed Vor 7 Jahren can i create a template like this for blogs portlet please advice Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen
William Sousa Vor 7 Jahren Hey guys, How can I implement this code using Liferay7?There are any example or tutorial for Carousel in Liferay7?Best regards! Melden Sie sich an, um auf diesen Beitrag zu antworten. Antworten als... Abbrechen