This is what your code looks like once it's copied and pasted in its' original format:

Here are the extra snippets of code you can add to your HTML widget to improve the placement:
  • Force the banner to drop down a line space = <br>
  • Change the alignment from default to center = class="aligncenter"
  • or... Change the alignment from default to right = class="alignright"

Insert these snippets of code into your custom HTML widget as shown below:

  • add as many<br> as you need to get the right spacing between the banner and any other widget above it. (I find it easiest to have my website open in a second tab, and just refresh the page (F5) after saving the widget... to quickly check how it all looks).
  • insert the code for alignment after the <img. Make sure there is a space before and after the code you have pasted.
  • Save and preview your website.

Voila! Here's what mine looks like...


Be sure to check out the next page for my quick and easy cheat to make customized HTML widgets of your own!


Join the Discussion
Write something…
Recent messages
bobrseno Premium
Thank you, Karen! Very helpful for those of us (me) who are not programmers. Bookmarked!

~Bob
Reply
kdforsman Premium
Thanks so much! If there’s anything I can do to improve the tutorial please let me know, Cheers Kaz
Reply
bobrseno Premium
Success, Karen! I applied both aspects of your tutorial this Friday evening. Went off without a hitch. I am so happy to be able to align my WA Banner and to create a custom widget. Very cool!

For some reason I never created a post draft in Word Press edit mode. I've only created posts in Site Content and then published them. It took me a minute to get what you were doing. Something so simple can be easily missed or cause confusion, at least for someone simple like me. :-)

Thanks again for the work you put into this tutorial.
~Bob
Reply
kdforsman Premium
Thanks very much for the feedback Bob, I'll go in and update this training to make it clearer what I'm on about! Glad you found the tutorial useful. Cheers, Karen
Reply
Debs66 Premium
Thank you for sharing and it does look so much better Like that too. :))
Regards Deborah :)
Reply
kdforsman Premium
Thanks Deborah, glad it helped
Reply
rileyroman Premium
Thanks for this, great to have an understanding of how to do this, it's still " greek" to me :))
Reply
kdforsman Premium
Feel free to ask for clarification if any of it is unclear, Cheers Kaz
Reply
rileyroman Premium
I meant it "was" greek" til I read your training..lol
Reply
kdforsman Premium
Hi Riley - I know what you mean!! Thankfully when I get myself too tied up in knots, I can get in touch with my son whose a full time software developer. But it's also good to experiment and not be afraid to try and solve problems ourselves, that's all part of the learning process. I learn better by doing. All the best with your affiliate journey. Cheers, Karen
Reply
HennieSteyl Premium
Great piece of training Karen. Bookmarked it for use very shortly. Thanks a stack.
Hennie
Reply
kdforsman Premium
Thanks Hennie!
Reply
KayWinkler Premium
Hey KD Forsman, good training. I just overflew it as I already knew something about it. But still, very helpful for many people I believe.

Cheers,
Kay
Reply
kdforsman Premium
Thanks Kay, appreciate your feedback - hope it will be useful for others on here. Cheers, Kaz
Reply
Top