Style tag in the same html page, instead of an external css file

Quick question:

When creating a new css rule, instead of linking & adding it to an external css file, is it possible to add them to a chosen “Style” tag in the head section? And have all css rules to go into this tag?

Possible currently with Pinegrow?

To clarify, Im asking about “Internal CSS” in the below image, I know the other two (inline & external) are supported oob by Pinegrow.

With best regards
Akayy

EDIT: The advice below is WRONG!!! I totally didn’t realize this was possible. See my post below.

Hi @TechAkayy,
No, you would have to cut and paste the rules from your stylesheet into the style tag.
Sorry,
Bob

1 Like

Thanks @robm for the confirmation! Guessing its not covered in Pinegrow as its generally discouraged.

Hi @TechAkayy
If the style you are creating is only used on that page it makes sense NOT to add it to your main style.css.

You can do it using either Inline or Internal methods.

INTERNAL:

1. <style> b {color:red} </style> or.......
2. <style> .red {color:red} </style>
Then either
1. The predominant colour was <b>RED</b> or.....
2. The predominant colour was <b class="red">RED</b>

INLINE:

1. The predominant colour was <b style="color:red">RED</b>

If the style is used on multiple pages add it to your main css file

1 Like

Thanks lot for the suggestions @mxs, ended up using a css file, easy to work with on PG

Hi @TechAkayy and @mxs,
Gah!! I’m constantly learning new things about Pinegrow! If you add <style></style> tags to your head element, you can then add that as an inline stylesheet in your Styles panel. You need to type in any new classes or ids, but then can use the visual editor to add in your styling. Just found this feature from another user! You might already know this @mxs
Cheers,
Bob

post-note: At the moment this is behaving a little oddly. The styles aren’t properly showing in the Active tab, but we are working on it.

No worries @RobM. In fact my original question above is, if it was possible to make “inline” (style tag under head) as the default for new css rules (instead of an external style.css file)…

Visually, I wanted to know if “inline” was an option in these dropdown…

image

… which I have realised is still not possible in Pinegrow, so your answer was still correct that I had to copy/paste from style.css to my inline style tag if I need to :wink:

Interestingly, I noticed that attribute styles when converted to a class, can be added to existing classes either to external style.css (or) inline (if there was one) :wink:

image

This could be a new feature you could explore as the logic is already there in the background, which is “inline” is sort of considered as yet another stylesheet within the styles panel…

image

Thanks for sorting this out :+1:t5:

And yeah, the word “inline” could slightly be confusing when used to refer the two ways - styling using attributes & styling using a style tag under head tag…

…what we are talking above is in fact “internal” as per w3schools.com, but I’m not sure about the right terminologies!

@TechAkayy,
Yeah, my fault. to many different conversations at once. I should have used internal, not inline. Pinegrow lists it incorrectly as (inline).
Cheers,
Bob

1 Like

It really doesn’t matter if you use internal or inline.

internal <style><style> in the head section should always follow the main external file.