How do I add links to img in the template?

Message Boards

Tiago Machado, modified 4 Years ago.

How do I add links to img in the template?

Junior Member Posts: 59 Join Date: 2/21/19 Recent Posts

Hello friends.

I created a web content that will be like my related content, I have a page with a movie, the movie has description, trailer, galery, etc. and below now it has a "Related Movies", what I did was simple I created a web content and insert 2 images with a link for those related movies pages, just using html and css.

but I want to create a template/structure so I dont need to apply each time the code for that, the problem is, how do I add links to each image I add? I defined that I can add as much images as I want(the related movies img that should have a link to theyr page), and each image should be defined a link when inserting the image... I shoulnt need to touch the structure/template to add a link... is that possible?

another question, im doing this related content using web content because I dont think I fully understood the related asset... all it shows is text with links or full content if I configure it for that right? what I wanted is to show clickable image, would be easy if there was a option to relate the content, for example, can I define that a certain image is related to a movie page and add a link to that image using the related assets? i coulnt do that...

thanks for your time

edit: another question, I dont want to create a new thread so I will post ir here.
in the DDL, is there anyway to add a custom field? I want to list the movies I added, but I want to rate them

Andrew Jardine, modified 4 Years ago.

RE: How do I add links to img in the template?

Liferay Legend Posts: 2416 Join Date: 12/22/10 Recent Posts

Hey Tiago,

I created a web content that will be like my related content, I have a page with a movie, the movie has description, trailer, galery, etc. and below now it has a "Related Movies", what I did was simple I created a web content and insert 2 images with a link for those related movies pages, just using html and css.

I'm not sure that this is the best solution because, if I understand what you are doing, you are actually creating multiple content items for the same movie. That shouldn't be neccessary -- if you need more than one rendering, you should really be using multiple WC templates for the same structure.

I think the short answer is that you are supposed to be using related assets. The Asset Framework in Liferay is used as a generic way to reference entities (usually content of some sort) in the system. When you create a journal article (web content) then there is a record that is added to the JournalArticle table, but there is also a "summary" type record added to the AssetEntry table that contains some basic stuff (title, summary, etc) and a pointer back to the record that was added for the complete article details in the JournalArticle table. If you check you will see that the resourcePrimKey value from the JournalArticle record is linked to the classPK on the AssetEntry.

Now in your case, you have lets say 3 web content "Movie" items you created --

1. True Lies
2. Terminator 1
3. Terminator 2

... now you want both those Terminator items to be "related assets" for the True Lies record. In the content admin yo uwould edit the True Lies record and in the Related Assets section you will hit the Select button and then choose the "Movie" structure. From there you an choose Terminator 1 and 2.

Now this means in your WCM Template that you used to render the movie you know have access to the related assets. Now, the list of links is the basic form, but you can always use Liferay's API tp retrieve the journal articles for each of the related assets and render their markup using a different WCM template.

... do you have a sample (mockup) of what you are trying to build?

edit: another question, I dont want to create a new thread so I will post ir here.
in the DDL, is there anyway to add a custom field? I want to list the movies I added, but I want to rate them

Don't worry about making new threads -- in fact you should. A.) a thread should be for a specific topic/question and B.) Someone else might have this same question and be confused or skip over this message because of the title.

For the ratings, there is an entire Ratings API that Liferay has out of the box. You can access it via taglib as well so all you need to do is use the taglib in your templates and VOILA! .. ratings.

Tiago Machado, modified 4 Years ago.

RE: How do I add links to img in the template?

Junior Member Posts: 59 Join Date: 2/21/19 Recent Posts

Hello Andrew, thank you for your help.

I tried to do what you told me but it says: There are no related assets available. This application will show all assets related to the main asset of the current page.

I'm gonna try to explain what I want and what I did:

In my main page I have my carousel portlet, and I have a menu, The movie page is configures with 2 columns, the left one has the recomended movies, an the right one has the high rated movies that has a small description and a read more link that redirects to that movie page, lets say I click in the LOTR read more, I am redirected to that movie page where I again have a page configured with 2 columns, in the left it has 2 portlets, one with the galery and below one with the trailer, and the right one has a cover with a description.
And below that portlet with the cover and description I want a related movies portlet where shows for example a cover of matrix, and that image cover should be clickable and redirect to that movie page.

what I want:https://ibb.co/yQpMD46

But as you said, that way I would have to create multiple web contents, and I wasn't able to link the image using the structure/template.

Thats what I want to do, show a clickable image and redirect to the movie page. but using the related assets isn't working like I show in the image.

What I did was going to LOTR portlet where it has the cover and info, went to the configure and related it to the Matrix portlet that has the cover and info too. even if that worked I would want to show the clickable image like I said and showed you, is that possible?

As for the rating, I didnt know that, and im really thankfull, but can I use the taglib in the portal? using freemarker?
What I want is to create a list of the movies(if I could auto add the list with the movies I already added would be great) in the portal, I created it using the dynamic list, but each movie should have a rating given by a registered user, and change given the avarege. for example jon snow comes and pick LOTR from the list and rate it, and then comes arya and rate the same movie, it would change the rating to the avarage. for that I would need a field Rating in the list (i managed to add it in the portal) and then do the avg, can be done using freemarker?

Thanks a lot!!

Edit: did I mistook the related asset with the asset publisher? I tries the asset publisher, configured it to show only related asset in the config panel, but it shows a lot of info that isn't even related, and that I did not relate...

edit2: well, I guess I can filter in the configuration and define the tags or category to show, that way its gonna show the related content that has those tags right? for example fantasy movie category/tags, it would show all those movies in the LOTR page. thats kinda cool.
Now the clickable image problem, gonna try to fix it, ill post if i manage to do it

Andrew Jardine, modified 4 Years ago.

RE: How do I add links to img in the template?

Liferay Legend Posts: 2416 Join Date: 12/22/10 Recent Posts

Oh man -- this is a lot to go over is a forum post emoticon

.

I think the only way to work through this is to break it down bit by bit. Let's start with the bseline stuff. I'm going to assume you have a blank site for the moment.

1. Create a new structure called "Movie" with the fields you need -- it doesn't have to be ALL of them for now, maybe just the title, description, image, and running time or soemthing. Also create a WCM template for the movie -- it doesn't matter what it looks like just yet.

2. Create a handful of movie content items -- and be sure to tag them when you create them. So actors names, maybe the production company, stuff like that.

3. Go to your homepage and add to this page the "Asset Publisher" portlet.

4. Configure this portlet so that it is grabbing content dynamically, but make sure you limit the types to just Web Content and your Movie structure

... you should now have a list of records showing your titles and summaries.

5. Now add a new page with /movie and the friendly URL

6. Go to this new page and set your layout -- 2 column whatever

7. Add the asset publisher to the column on the page that you want to render the movie details

8. Configure the asset publisher --

   a. set it to be a "Manual" selection of the item

   b. go to the display settings tab

   c. expand the set and enable panel and make sure to check the "Set as default Asset Publisher for this page"

.. ok, now this will become your "display page". Now we have to configure the content items you created to use this as their display page.

9. Go back to the web content admin and edit your records one by one. For each one you want to open the DISPLAY PAGE panel and choose to set the page. From the popup that results, you make sure to choose your /movie page and save the item.

10. Once you have updated your items, you can go back to the home page and when you click on one of the items from the asset publisher, it should redirect you to the /movie page and render the movie content item in the space where you configured the asset publisher.

.. ok, once you have all this done such that you can create content and it appears on the homepage, and when you click on it you see it render in the /movie page, come back and we'll go to the next step.