How do I see the attirbutes of a class?

User 2488786 Photo


Registered User
192 posts

It's been a long time since I've worked with the software, and I'm hoping that you'll be able to point me in the right direction.
I am using a template and trying to teach myself how to change things, and notice that the pictures use these classes, and I was wondering where I can see what the attributes are for these and or change them.
Thanks for the help!
Attachments:
An expert at using the wrong tool the right way.
User 2699991 Photo


Registered User
5,332 posts

Rick Williams wrote:
It's been a long time since I've worked with the software, and I'm hoping that you'll be able to point me in the right direction.
I am using a template and trying to teach myself how to change things, and notice that the pictures use these classes, and I was wondering where I can see what the attributes are for these and or change them.
Thanks for the help!


you can apply image sizes (Height/width etc) padding margins all from the styles panel, The settings you choose will apply to all picture elements with that class name.

If you want to change the class name to something of your own choice then simply delete the existing class name, then without doing anything else type in your preferred class name, and then do any adjustments as you wish.

(any other picture element you want with the same things just give it that new class name.)

Alternatively you can apply an ID to that image, and then make any changes "Applied to that element ID only." so for example if you wanted that image to have a link to somewhere etc, but ONLY that image then you would apply the link to the ID of that image, therefore keeping all the sizes attributes etc the same as all the other images but only that one would activate the target for the link.


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 2699991 Photo


Registered User
5,332 posts

By the way, it would be useful if you could tell us the template you are testing, so someone can perhaps be more specific about changes to the image (attributes/styling etc,
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 2488786 Photo


Registered User
192 posts

Thanks, this helps so much. Now I understand someone who made the template created those classes, and they're not like a set list of classes.
An expert at using the wrong tool the right way.
User 2699991 Photo


Registered User
5,332 posts

Rick Williams wrote:
Thanks, this helps so much. Now I understand someone who made the template created those classes, and they're not like a set list of classes.

I would assume that if you wanted to view all the built in bootstrap class names settings you would need to visit their website. I don't use bootstrap so wouldn't know exactly where it would beon their site, but a search request as would give you some links perhaps.
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 2699991 Photo


Registered User
5,332 posts

Yess indeed there are tons of them out there

https://bootstrapclasses.com/

W#C schools also has a full list with a description of what the built in class names provides
https://www.w3schools.com/bootstrap/bootstrap_ref_all_classes.asp


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 2699991 Photo


Registered User
5,332 posts

Short of all that

open a blank project, and simply work your way through all the built in attributes for all the components.

Beware when searching for the attributes list, that Site Designer uses bootstrap 3 or 4, but the latest version id 5.(something) so it maybe different. Be specific to the bootstrap version you are using when doing a search.
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 122279 Photo


Senior Advisor
14,633 posts
Online Now

Its A Kind Of Bali Magic wrote:
Yess indeed there are tons of them out there

https://bootstrapclasses.com/

W#C schools also has a full list with a description of what the built in class names provides
https://www.w3schools.com/bootstrap/bootstrap_ref_all_classes.asp


By the way, Wayan, do you happen to know if there is such a reference page for the Foundation classes as well? I've never found any.
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 2699991 Photo


Registered User
5,332 posts

Inger wrote:
Its A Kind Of Bali Magic wrote:
Yess indeed there are tons of them out there

https://bootstrapclasses.com/

W#C schools also has a full list with a description of what the built in class names provides
https://www.w3schools.com/bootstrap/bootstrap_ref_all_classes.asp


By the way, Wayan, do you happen to know if there is such a reference page for the Foundation classes as well? I've never found any.


Me too maybe one day I will make something
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 2699991 Photo


Registered User
5,332 posts

Its A Kind Of Bali Magic wrote:
Inger wrote:
Its A Kind Of Bali Magic wrote:
Yess indeed there are tons of them out there

https://bootstrapclasses.com/

W#C schools also has a full list with a description of what the built in class names provides
https://www.w3schools.com/bootstrap/bootstrap_ref_all_classes.asp


By the way, Wayan, do you happen to know if there is such a reference page for the Foundation classes as well? I've never found any.


Me too maybe one day I will make something


But the again looks like far too much work, (not sure I have long enough left in this life)

Seems to me to be far quicker and easier to just DIY it, (There are some that built in foundation class names that actually do something if you apply one, but again trawling through the long long list (phew) anyway

for example:
"large-text-centered"
applied to H1,H2 etc and paragraphs,, will center a text element ino it's parent element at the large break-point 1024px
even if all breakpoints are disabled (that's pretty useful for those like me who start off with basic designs/formatting etc with ALL Breakpoints disabled)

There are others "medium-text centered" does exactly what it says
and you can apply different class names to the one element
EG a H1 with foundation class name "medium-text-centered" and an additional class name "large -text-align-right

So at medium device widths (first default break-point) the text is centered, and at large (second default break-point) the text is on the right side of its parent element.

But then again quicker and easier in my opinion, (within Site Designer) to just add your own class name 9logically thinking it could well turn out to be the same name as the foundation one anyway, in which case the foundation built in attribute would be applied.

So sorry folks, in my opinion, just DIY it, unless you have all the time in the world to go though each one and make your own list.

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.