• Hello,

    Amazon does provide affiliation HTML code like this for bloggers to promote their products:

    <a href="https://www.amazon.fr/NEENCA-Genouill%C3%A8re-Professionnelle-Stabilisateurs-Genouill%C3%A8res/dp/B0B3M71W11?&linkCode=li3&tag=cadpr-21&linkId=b6b4d64164f621e28176525ddcf8fe73&language=fr_FR&ref_=as_li_ss_il" target="_blank"><img border="0" src="//ws-eu.amazon-adsystem.com/widgets/q?_encoding=UTF8&ASIN=B0B3M71W11&Format=_SL250_&ID=AsinImage&MarketPlace=FR&ServiceVersion=20070822&WS=1&tag=cadpr-21&language=fr_FR" ></a><img src="https://ir-fr.amazon-adsystem.com/e/ir?t=cadpr-21&language=fr_FR&l=li3&o=8&a=B0B3M71W11" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />

    This is an actual code for you if you need to test.
    When integrated into a Custom HTML Block, such a code generate a clickable image like this one.

    The issue is that the Custom HTML block does not enable any adjustment. As such I needed to add the following code to center-align the image:
    <div style="text-align: center"></div>

    I would also like to add some top and bottom margin.

    How can I do this to avoid having to do it manually each time I add a new image to my blog posts?
    Is there a way to create a button to replicate the align-center and top margin functions?

    Please note that I’m not a coder, but I find it weird that WordPress does not offer such features with a wisiwig one-click option. So what is my best option?

    I assume your answer will be to create a CSS?
    What should that CSS be then?

    Also, does it mean I will need to apply the class manually into each new Custom HTML Block?

Viewing 11 replies - 1 through 11 (of 11 total)
  • Please note that I’m not a coder, but I find it weird that WordPress does not offer such features with a wisiwig one-click option. So what is my best option?

    I’m not sure I get your point.

    Perhaps the block is named “CUSTOM HTML” block and not WYSIWYG block for a reason?

    You’re using a block specifically named CUSTOM HTML block — for adding your own custom HTML code — and you find it weird that you can only make changes via custom HTML code? Or am I misunderstanding your point?

    I assume your answer will be to create a CSS?
    What should that CSS be then?

    Also, does it mean I will need to apply the class manually into each new Custom HTML Block?

    If you want to use the CUSTOM HTML block only, then, of course, you need to write custom HTML (and CSS) code.

    But you could place the CUSTOM HTML block inside a parent container (eg ROW block) and use WordPress’ visual controls to center this parent container.

    So, given that your advertising partner gave you CUSTOM HTML CODE (and not an image and referral link so you can use the visual blocks WordPress offers)…

    You’ll either have to:

    1) Write custom CSS code (one-time) and add a CSS class (each time) to your custom HTML code (or the custom HTML block) to style the custom HTML code you were given… OR

    2) Place the custom HTML block (with your custom HTML code) inside a ROW block (each time), so you can use the visual tools to style the parent ROW block.

    If it’s the same HTML code you’re using over and over, you could turn either of the two options above into a REUSABLE BLOCK that you can easily insert every time.

    Good luck!

    • This reply was modified 1 year, 12 months ago by George Appiah.
    Thread Starter masterhealerwp

    (@masterhealerwp)

    Thank your for your reply.

    I just tried the ROW block option. Is there a way to manage spacing and padding for that type block? I was not able to find it.

    Please take a look at the screenshot below.

    Kindly note that you may have to click the 3 dots to enable some of these controls: SPACING (between rows), PADDING, and MARGIN (not shown in screenshot).

    Essinge Rail AB är sedan 2006 etablerat på den nordiska transportmarknaden. Företaget bedriver internationell transport- och speditionsverksamhet från Europa baserat på skogsindustrins konventionella järnvägssystem. I egen regi fraktas 250 000 ton gods inom segmenten livsmedel, handel och verkstad från Europa. Företaget äger och driver både en egen järnvägsterminal och ett eget åkeri för att klara högt ställda krav på kvalitet, säkerhet och miljö.
    godstransport

    Thread Starter masterhealerwp

    (@masterhealerwp)

    @gappiah your screenshot is so small. I cannot read the text.

    But all I know is that I cannot find the spacing and margin option for a Row block.
    Please have a look at my screen and tell me where to click.

    My WordPress version is the latest one.

    Sorry about the small screenshot. My screenshot linked below is annotated with a huge red arrow pointing you in the right direction.

    https://i.snipboard.io/nPFMyA.jpg

    Thread Starter masterhealerwp

    (@masterhealerwp)

    Your screenshot is perfectly readable this time, but I’m sorry I can’t fond the Dimensions settings.

    Have a look: I have the latest WordPress version and I don’t have that at all.

    Below the Typography size (S, M, L, XL…), I have Advanced (Avancé) while you have Dimensions.

    You may have installed a specific plugin for that?

    You may have installed a specific plugin for that?

    No, this was a test site I created just to answer your question, using the default theme without a single plugin installed.

    Since themes can add their own styles and controls to the default blocks, I’m suspecting it might be down to the theme: I used the new default theme for 6.1, the Twenty Twenty-Three theme.

    Thread Starter masterhealerwp

    (@masterhealerwp)

    Ok, I just tested with Astra: I find the same as you have.

    But on my site I’m using the theme https://presscustomizr.com/ and I cannot see the Dimensions settings. Really weird?

    Out of chance, if you can quickly upload this theme (free version) and tell me if you have the same behavior?

    Out of chance, if you can quickly upload this theme (free version) and tell me if you have the same behavior?

    I installed this theme, and the DIMENSIONS disappeared.

    Switched back to 2023, and the DIMENSIONS came back.

    Thread Starter masterhealerwp

    (@masterhealerwp)

    So we now know the Customizr theme is the culprit.
    Thanks for testing this and helping me double-check this issue.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘How to adjust the layout of Custom HTML Blocks?’ is closed to new replies.