Hello,
I am trying to create a dynamic blog card.
I would like the freedom to allow users to upload the featured image. Maintain the original image that user uploads without processing/resizing.
I would like to use a css property with a background as a cover.
{exp:channel:entries channel="blog_news" disable="categories"}
{blog_card_img}
<div class="blogcard_img" (style)="background-image: url({url});width: 100%; height: 350px; background-size: cover;></div>
{/blog_card_img}
{/exp:channel:entries}
The above code did not work. It is displaying the image at the tag “{blog_card_img}” it is not getting the image from the {url}. What am I doing wrong here?
The following also did not work.
Link custom stylesheet from EE. Created a css style in EE. Linked in templated.
<link href=”{path={Style/dynamicStyle}}” rel=”stylesheet”>
and the css contains:
/* Blog Cards */ .blogcard_img{ width: 100%; height: 350px; background-image: url({blog_card_img}); background-size: cover;
}
Please help.
Forum was removing code. (style) does not have (parentheses).
Try to overcome all obstacles to rescue the princess in the Super Mario game.
To use this feature, open a Module message, dino game then click “Add Cards” and then “Dynamic Cards.” There will be an input section where you can enter the URL of the service that will return the Cards.
This post came up for me. It appears to be a year old. However it does not seem to have a response.
Where you able to find a solution?
Why do did you have the the “style” wrapped in brackets ‘{}’? Perhaps that was the issue.
One more thing that I would suggest is to add a conditional for if there is an image. Or you might get an error if you dont make it required.
Try this code: See if it works.
{exp:channel:entries channel="blog_news" disable="categories"}
{if blog_card_img}
{blog_card_img}
<div class="blogcard_img" url({url});width: 100%; height: 350px; background-size: cover;></div>
{/blog_card_img}
{/if}
{/exp:channel:entries}
Packet Tide owns and develops ExpressionEngine. © Packet Tide, All Rights Reserved.