Difference between section and div section

What is the difference between a section and a div section?

Are you referring to the blocks or the tags?

Both.
I don’t know which block to use, and I don’t know the difference between section and div section tags.
Sorry, I haven’t learned HTML and CSS properly.

Blocks:

  • Information on what a Cwicly Section Block is and how to use it
  • A Div block is just a plain HTML container which you can tweak to your needs. It’s the base of every website. More info

Tags:

In case something is unclear, just let me know and I will go into more detail, especially in relaition to Cwicly’s use cases.

1 Like

I will study it. @Marius Thanks!

Let me know if you have any recommendations for websites you think are correctly marked up.

I think the best idea would focus on sites that teach you the actual topic. It is crucial for them to have it for obvious reasons.
A small downside might be that they are mainly blog sites. So you might missing things.

You could check the Kinsta site, I think that covers almost every possible use case, and it has a beautiful design.
This is what you call perfect HTML.
They also focus on accessibility and it’s WP based I think, so that might be also a bonus.

I’ll check it out right away!
@Marius Thank you very much.

I would also recommend checking some technical references to learn about semantic HTML tags:

Take it a bit at a time, learning as you go. Don’t have to learn every single one of them all at once.
I would also recommend using DevTools (inspector) in your browser on sites you normally browse. Get familiar with how big companies with large teams of developers put things together. Great to learn different techniques.

To your original question, the Cwicly Section block is a composite element made up of two divs: A wrapper, and an inner container div. It’s a quirky element, since some settings apply to the wrapper, and others to the inner container.

For what it’s worth, I do not use it. It’s meant to help, but once you get more comfortable building sites, you may realize you don’t need it.

@owynter Thank you! I will check it out.

I’ve created a header, footer, and page template…what could possibly go wrong with this kind of markup?
202205310150

Nothing wrong with the general setup @Takeru :slightly_smiling_face:
You could change the HTML tag of the header template part block to <header> (the same thing you did with the footer, I guess), but don’t forget to remove it from your inner div then.
Make sure you use the <article> tag in a correct way.

@Marius Thank you!
I can’t change the tags in the header of the template parts, is this using WordPress?
I have not done anything to the footer.

Maybe you want check the advanced options of the template part block:

2 Likes

@Marius Thanks!
I was not aware of that setting.

202206010629

I was trying to set up everything within Cwicly, but I should have learned to set up FSE in WordPress itself.

Great!
That’s how it should be :muscle:
Keep in mind to remove the <header> tag from your inner Cwicly div (id="div-c166a07").

There is nothing wrong with that as well.
It’s totally up to you, feel free to handle everything with Cwicly blocks only.
On the other side, using template parts, you have a more modular approach which makes life a lot of easier.

The most important part is to understand your possibilities and then choose the way you feel most comfortable or you think is most efficient for you.

I removed that tag.:+1:

202206010641

I am getting better at using it every day through trial and error, but there are still many things I don’t understand.
The members of the Cwicly community, including you, have been very helpful!:tada:

1 Like

Thanks for this. I wasn’t aware this was possible.

Also, wherever your navigation container starts, be sure to add a tag.

Thanks! @owynter
I set it up immediately.

202206020348

1 Like