Sections for Hooks

[Anders]

Is there any filter, or some small hack I can do, for having the “sections” work in the “Elements” -> “Hook”?

[Anders]

1. It would make site elements (Hooks) a lot more easy to maintain.

2. This code do not look the same when it’s inserted on a page, using a Hook. As it do – using a page. (and thats the main issue)

[lgc_column grid=”70″ tablet_grid=”70″ mobile_grid=”100″ last=”false”]
<p class=”big-header”>This is some information</p>
<p class=”medium-header”>Call me 12 12 12 12</p>
[/lgc_column]
[lgc_column grid=”30″ tablet_grid=”30″ mobile_grid=”100″ last=”true”]
Call me
[/lgc_column]

[David]

Hi there,

unfortunately not – we have toyed with the idea of adding other editor options to the hook but nothing concrete at this time.

Could you link me to the page where you have hooked in the columns and i can take a look and advise on what needs to be done.

You can edit your original topic and use the Site URL field to share a link privately. Let me know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Anders]

Thanks, I added a link.

The button to the right does not allign in center (top-bottom) in the hook content.

I wrapped the code like this:

div class=”generate-sections-container”
div class=”grid-container grid-parent generate-sections-inside-container”
[lgc_column grid=”70″ tablet_grid=”70″ mobile_grid=”100″ last=”false”]
<p class=”big-header”>This is some information</p>
<p class=”medium-header”>Call me 12 12 12 12</p>
[/lgc_column]
[lgc_column grid=”30″ tablet_grid=”30″ mobile_grid=”100″ last=”true”]
Call me
[/lgc_column]
/div
/div

[David]

Hi there,

so the columns that are displaying correctly, there is a <br> tag above the button which is changing the vertical position. This is missing in the Hooked in code.

Instead of using a <br> tag to force the button down you could use a little CSS flex box to vertically align the content to the center:

.generate-sections-container .inside-grid-column {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

This will apply to all columns in a section with the generate-sections-container class so if needed you could add your own CSS class to the hooked content or a section and target that instead.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Anders]

ok, I’ll give it a try… I have not added the <br> tag, must be generated by the output

[Anders]

Got it working.. Thanks

[David]

Yeah chances are the <br> tag was being auto added – glad you got it resolved.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts