Following on from my last video tutorial about how to split your post up in the new Typepad compose editor so you get the "Continue reading…" link on the front page of your blog, Bebe Jacobs of BeginAfresh.com has asked me to show her how to insert images into the side margins.
Here are 3 little videos of 5 mins each which will show you exactly how to do it using a Typepad 'Notes' type Typelist*. Eventually, Bebe will create pages to link the images to. In Video 3. I show her where she will need to place the page url for the new pages. Click on one of the images or links below to launch it in a new (much bigger) window:
Assuming this is all new to you, I'm inserting a Notepad doc at the end of this post which will give you the HTML code 'skeleton structure' for creating text links and image links anywhere on a blog or a website, whether in a post, a Typelist or a WordPress text Widget. You may notice a couple of differences from the code I used in the videos eg. alt attribute in the anchor string. These aren't hugely important so I'm not going to say anymore on that right now. Simply click on the link to download it.
Key to remember…If you want to include an image, it must first be hosted somewhere. In Typepad, you can upload an image into the Files area. Go to Control Panel and then click on the Files tab.
From there, select the parent folder for the blog you are working in (not essential, but it will make things easier to find in the long run) and then use the Upload A File box to the right hand side of the page.
Once uploaded, click on the file name to open it up in a new window or tab and whatever is showing in your browser address bar is the 'image url' which you then paste between the 'double quote marks' (") in the IMG SRC code string.
Of course, if your image is hosted elsewhere, you could use that url – unless its on a third party site with whom you have no connection – doing that would be rude!
Download Notepad doc: HTML for image and text links
*The code used here is not uniquely for use in Typepad. It's basic HTML, so you can use it anywhere.
RSS
Twitter
Facebook
Google+
LinkedIn
YouTube
Blip.fm
this is very useful specially if your just starting using type pad. nice post!
Very useful, thank you very much.
I recently came across your blog and have been reading along. I thought I would leave my first comment. I don’t know what to say except that I have enjoyed reading. Nice blog. I will keep visiting this blog very often.
Sarah
http://www.lyricsdigs.com
This is nice, It will help us on how to insert an image into typepad. thanks for the post.
-faith-
Thank you! Thank you! Thank you! I had been fussing with typelists for hours trying to get image links to link out. I had been using the Link type of typelist until I found your video instructions. I can’t thank you enough – you saved me hours of work! PS. I typically set-up blogs for clients in WordPress. Typepad is really new for me. I’m *so* glad I found your blog.
My pleasure Patti!
I use http://twitter.com/ClaireRaikes more these days.
Typepad is really very simple compared to WordPress (I do both too), but Typepad has made so many changes that it can be a bit of maze. As with all things, once you know how its a doddle – so glad that this old post has proven useful to you. If you get stuck with anything, please just shout
Warmest
Claire