19 November 2016

Playing with Blogger...

This post is all about playing around with my Blogger template...

In my professional life I sometimes play with HTML and CSS coding when developing e-learning packages, which got me thinking about how to expand and collapse text on my blog. After a bit of experimentation, I finally worked out how:

EXTRA INFO to read (or not)
I can put text or materials lists in here and it won't clutter up my blog post...

EXTRA IMAGES to look at (or not)

How to do it:
1> Enable JavaScript/jQuery in the blog template - Some custom templates already have it built in; if not, the code needs to be added. Basically, this says to Blogger, "Hey, I want to be able to expand and collapse some bits of my blog."
2> Add CSS script to the blog template - This defines the look and feel of the hidden containers. I can change the default colours, backgrounds, fonts etc in the style sheet.
3> Add HTML code to the individual posts - This defines which parts of the post I want to expand or collapse.

I did a bit of research to fine tune what I came up with; a quick internet search will ALWAYS return quite a few hits!   For me, the most helpful post was THIS ONE.  I edited the CSS to suit my own style, but the other codes were all ready to go with no modification.

Obviously, if I change my blog template in the future, I will need to repeat these steps to ensure the new template still does everything I want it to.

Thank you for visiting my blog!

1 comment :

Thanks for visiting and taking the time to leave a message :)