Clicky

Hooks in AMP Theme Framework

Let’s dig into one of the most important part of AMP theme framework and i.e., “Hooks”

We have added extra hooks in our AMP Theme Framework which will make the theme more playable.

The list of hooks and their functionality:

Sitewide { These hooks will run throughout the AMP website }

1: amp_meta

It is used to add things in the head section of AMP which will come handy if you want to add some extra meta tags, to add extra js of AMP components and other things which will go in the head section.

2: amp_css

It is connected inside <style amp-custom> with the help of which you can add your own styling in AMP pages

3: amp_start

This hook is connected immediately after the beginning of the body tag. There are many use cases of it and some of them are GTM and analytics.

4: amp_end

You can use this one to add things before the end of the body tag, the most common usage is to add analytics. You can even add the social sticky with this hook.

5: amp_after_header

It is useful if you want to add things right after the end of your header, like if you want to add view-non-amp or an ad immediately after the header then you can use this hook

It will be useful If you want to add things right after the article but before the footer.

The below 2 hooks are mostly for those people who love to add more life to the sidebar.

7: amp_sidebar_start

This hook is connected right after the beginning of amp-sidebar. If you want to add more things inside the sidebar and at the beginning of sidebar, you can use this hook safely.

8: amp_sidebar_end

It’s same as the above one but will be useful to add things before the end of sidebar.

9: amp_post_template_head:

It is used to add extra things in Head section of AMP which will come in handy if you want to add extra meta, JS of AMP components, etc..,

10: amp_post_template_css:

It is used to add extra CSS to your AMP pages

single.php { Posts and Pages }

1: ampforwp_before_post_content

This hook executes before the loop (single posts/pages). It can be used to add anything just above the loop.

2: ampforwp_after_post_content:

This hook executes after the content.

index.php { These hooks will execute on HomePage}

1: amp_before_loop

If you want to add few components or things or text above the loop of index, archive, and search then you can use this hook with ease

2: amp_after_loop

Do the same thing as the previous one, but is used to add components and any AMP related things after the end of the loop

We are going to add more hooks including components specific hooks in our future updates if you want you can also contribute to it.

That’s it for this tutorial!

We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.

.

Ask your Questions Directly!
If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!
Updated on June 28, 2019

Was this article helpful?

Related Articles

Need Support?
Can’t find the answer you’re looking for? Don’t worry we’re here to help!
Contact Support

Leave a Comment