Using unsemantic to customise page display

[Ryan]

Hi Tom,

Just wondering how I can ‘tap’ into the framework behing GP (Unsemantic) to further customise my pages and provide more custom columns within the visual page editor. Also I am hoping for a way to use custom class syntax (like you can in foundation) to remove some div elements from display on mobile devices.

I am aware that most elements will just fold down into 1 column grids and stack on top of each other but I want to remove some divs from the flow entirely when viewing on a mobile device.

I know you don’t have a layout or page builder (and for good reason considering the load it puts on web pages) but at the same time, I am looking to further customise particular pages (this one is the homepage) by inserting extra columns/grids to layout information and even perform some additional markup on them.

The downside to this, of course, is that it makes it quite difficult for a client to update without having a good solid foundation in editing/writing HTML (this is usually where the page builders come in). I’d love to hear some suggestions regarding this particular problem.

Thanks

[Ryan]

BTW, my first thought is to go to the “text” mode in the visual editor and hand code the HTML myself using the unsemantic class markup. Is this the best solution or is there a better way?

[Tom]

I personally hand code it, but that’s because I’m comfortable with it.

You can use these classes:

hide-on-desktop
hide-on-mobile
hide-on-tablet

Your main options are:

a) Hand code the HTML
b) Use a page builder
c) Use a plugin like this: https://wordpress.org/plugins/lightweight-grid-columns/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Ryan]

Neat.
Thanks for that Tom. It’s given me more options than I thought I had (precisely the reason for asking for your support).

I think I will see if I can hand code the HTML first (I am comfortable with it too). Website is a very simple startup. So if it does get more attention and owner wants to take it further, I can look at using your plugin and maybe a page builder.

[Tom]

Glad I could help 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts