- This topic has 7 replies, 2 voices, and was last updated 1 year, 10 months ago by Fernando.
-
AuthorPosts
-
May 3, 2022 at 6:58 pm #2208427Vince
I need to add API codes to 2 pages. I have never created custom post types or templates as this is my first generate press site. How can I add the API code to the 2 pages that I need to add it to? What steps do I need to take to ensure that the code displays properly and everything is set up properly? Thanks in advance.
May 3, 2022 at 7:26 pm #2208441Fernando Customer SupportHi Vince,
The easiest way to add a Code to a specific page is through a Hook Element.
Reference: https://docs.generatepress.com/article/hooks-element-overview/
You may set in which pages should the code be added through the Display Rules.
Hope this clarifies. 🙂
May 5, 2022 at 5:35 pm #2210881VinceThat helps! I was able to add it to my page but I am having a hard time styling it. How can I make this form 80% wide and center aligned? I have never styled javascript before.
May 5, 2022 at 5:58 pm #2210891Fernando Customer SupportIs this from a plugin, specifically, Hubspot? I believe their forms have a shortcode. If so, you may place this shortcode in a Shortcode Block within a Container Block, if you’re using GenerateBlocks. Then, set a width there.
Moreover, as this form is from a third party, it would be best to reach out to them with regards to styling it.
If you would like to force its styling through code, you can try adding this CSS in Appearance > Customize > Additional CSS:
div#hbspt-form-1651797468814-3780032579 .hs-form-7da4d04d-2a75-40b3-93a6-4af5874c84e6_686b6f38-81bd-4784-bcad-77d70438e37a.hs-form { width: 80%; display:flex; flex-direction:column; } div#hbspt-form-1651797468814-3780032579 { text-align:center; display:flex; justify-content:center; } .hs_recaptcha.hs-recaptcha.field.hs-form-field { align-self:center; } .hs_submit.hs-submit { align-self:center; }
However, as mentioned, it would be best to reach out to the support of this form.
Hope this clarifies. 🙂
May 5, 2022 at 6:07 pm #2210895VinceGotcha ok, now the other api thing I need to add is on this page next to the block of text that is there on the left. How can I add a hook and direct it to show up there to the right of that block of text in its own container?
May 5, 2022 at 6:09 pm #2210896Fernando Customer SupportTo clarify, doesn’t this have a shortcode alternative? Most plugins offer as such.
Kindly let us know. 🙂
May 5, 2022 at 6:12 pm #2210898VinceFrom what I know, it doesn’t have one. Is there a way to do it with the hooks and direct it there?
May 5, 2022 at 6:17 pm #2210900Fernando Customer SupportThank you for clarifying.
To answer your question, yes, there is. You can create a portable Hook Shortcode which you can place anywhere manually, and hook on to in your Elements.
Here is a step-by-step way on how to do it: https://generatepress.com/forums/topic/ads-show/#post-2161670
Basically, with the portable Hook Shortcode, you may create a Grid Block then, add the portable Hook Shortcode to the right.
Hope this clarifies. 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.