Site Designer and the future of Web...

User 2699991 Photo


Registered User
5,391 posts

Stonecherub wrote:
Ah, the magic phrase "(as long as you know what or how to do it)!"

How the hell, within the framework of CoffeeCup, do I find out "what or how to do it?"

I bought the Materialize components for handling images and find myself experimenting where I don't quite understand the explanations or they aren't complete.

For example, I would like to put short captions on the images in a MaterialBox grid gallery. Where do I find out how to do that?

CC software is good but leaves me immensely frustrated.


ASK

Look Listen & Learn
There are of people on this forum, that can help,

and you don't need to use materialize components to put captions over images.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
User 244626 Photo


Registered User
811 posts

Use the data caption attribute as per the instructions on https://materializecss.com/media.html
Bootstrap 5 CSS Grid.
User 2040390 Photo


Registered User
95 posts

Twinstream wrote:
Use the data caption attribute as per the instructions on https://materializecss.com/media.html


Thankyou for the link, Twinstream. I experimented with this but it did not work. Maybe because I am using MS Edge as the default browser to preview changes to my website.
User 122279 Photo


Senior Advisor
14,646 posts

Did you add the initialisation script?
Here is a wee file that I just banged together. No images, just the placeholders.
Attachments:
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 244626 Photo


Registered User
811 posts

Stonecherub wrote:
Twinstream wrote:
Use the data caption attribute as per the instructions on https://materializecss.com/media.html


Thankyou for the link, Twinstream. I experimented with this but it did not work. Maybe because I am using MS Edge as the default browser to preview changes to my website.


Ok, sorry you will not be able to use the data-attribute method. This is probably because Coffeecup does not allow adding data-attributes directly to the <img> tag.
Bootstrap 5 CSS Grid.
User 244626 Photo


Registered User
811 posts

Actually it works here as the data-attribute is added to the div tag that wraps the picture tag that wraps the img tag..

https://material-components.coffeecup.c … albox.html
Bootstrap 5 CSS Grid.
User 244626 Photo


Registered User
811 posts

Here is a sample project of the Material Box if it helps...
Attachments:
Bootstrap 5 CSS Grid.
User 2699991 Photo


Registered User
5,391 posts

Here is a video demo of one I have as a component but with the Foundation framework not materialize
captions & text overlay too

https://youtu.be/IpAdGsvQaW4
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS


A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.