mr ailsbury Posted January 12, 2012 Report Share Posted January 12, 2012 Hi guys, I've just started a new BLOG on blogger.com and I wanted to add a button to my Vimeo/twitter pages to it. I just want the THIS logo, or a similar one and the same for twitter so that when it's clicked you're taken to my profile pages. I'd also like an interesting banner for the top of the page to replace the "Tom Amesbury Films" title. If anyone is up for making these for me please let me know cheers, Tom My profile links for the buttons TWITTER VIMEO Quote Link to comment Share on other sites More sharing options...
aener Posted January 12, 2012 Report Share Posted January 12, 2012 Well I realize this is pure HTML, and there's no fancy JS or whatever, but if you just want it simple: A link is done by <a href="www............com">Link Text</a> And an image is <img src="image url"> So you can have the image as the link by <a href="link"><img src="image url"></a>. For your Vimeo: <a href="http://vimeo.com/tomamesbury"><img src="http://elektro-lux.net/ktv/wp-content/uploads/2011/12/0404-vimeo-icon-300.jpg" width="20%"></a> The width="20%" is there because it's massive. You can set this by an absolute value (pixels) if you want. width=200 would make it 200 pixels wide, no need for inverted commas. You should also host the image in your own webspace rather than hotlinking. Just good manners. All of this is only from what I remember. You're best off waiting for Muel or someone Quote Link to comment Share on other sites More sharing options...
Tom Canham Posted January 12, 2012 Report Share Posted January 12, 2012 (edited) Paste this into the html of the page, where you want the logo to appear. This links the vimeo logo to your vimeo profile. <a href="http://vimeo.com/tomamesbury"><img width=100" height="100" src="http://elektro-lux.net/ktv/wp-content/uploads/2011/12/0404-vimeo-icon-300.jpg"</img></a> If you want to change the size of the image, change the numbers after 'height' and 'width' As Aener said, if you just put numbers, that represents the amount of pixels that are present. Edited January 12, 2012 by Tom Canham Quote Link to comment Share on other sites More sharing options...
mr ailsbury Posted January 12, 2012 Author Report Share Posted January 12, 2012 When I put that in I get this message Invalid variable declaration in page skin: The skin variables could not be parsed as they are not well-formed. Input: <?xml version="1.0" encoding="UTF-8" standalone="yes"?><SkinVariables><Variable name="keycolor" description="Main Color" type="color" default="#ffffff"/><Group description="Page" selector="body"><Variable name="body.font" description="Font" type="font" default="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="body.background.color" description="Background Color" type="color" default="#000000"/><Variable name="body.text.color" description="Text Color" type="color" default="#ffffff"/></Group><Group description="Links" selector=".main-inner"><Variable name="link.color" description="Link Color" type="color" default="#888888"/><Variable name="link.visited.color" description="Visited Color" type="color" default="#444444"/><Variable name="link.hover.color" description="Hover Color" type="color" default="#cccccc"/></Group><Group description="Blog Title" selector=".header h1"><Variable name="header.font" description="Title Font" type="font" default="normal bold 40px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="header.text.color" description="Title Color" type="color" default="$(body.text.color)" /><Variable name="header.background.color" description="Header Background" type="color" default="transparent" /></Group><Group description="Blog Description" selector=".header .description"><Variable name="description.font" description="Font" type="font" default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="description.text.color" description="Text Color" type="color" default="$(body.text.color)" /></Group><a href="http://vimeo.com/tomamesbury"><img width="100" height="100" src="http://elektro-lux.net/ktv/wp-content/uploads/2011/12/0404-vimeo-icon-300.jpg"</img></a><Group description="Tabs Text" selector=".tabs-inner .widget li a"><Variable name="tabs.font" description="Font" type="font" default="normal bold 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="tabs.text.color" description="Text Color" type="color" default="$(body.text.color)"/><Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="$(tabs.text.color)"/></Group><Group description="Tabs Background" selector=".tabs-outer .PageList"><Variable name="tabs.background.color" description="Background Color" type="color" default="#141414"/><Variable name="tabs.selected.background.color" description="Selected Color" type="color" default="#444444"/><Variable name="tabs.border.color" description="Border Color" type="color" default="$(widget.border.color)"/></Group><Group description="Date Header" selector=".main-inner .widget h2.date-header, .main-inner .widget h2.date-header span"><Variable name="date.font" description="Font" type="font" default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="date.text.color" description="Text Color" type="color" default="#666666"/><Variable name="date.border.color" description="Border Color" type="color" default="$(widget.border.color)"/></Group><Group description="Post Title" selector="h3.post-title, h4, h3.post-title a"><Variable name="post.title.font" description="Font" type="font" default="normal bold 22px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="post.title.text.color" description="Text Color" type="color" default="$(body.text.color)"/></Group><Group description="Post Background" selector=".post"><Variable name="post.background.color" description="Background Color" type="color" default="$(widget.background.color)" /><Variable name="post.border.color" description="Border Color" type="color" default="$(widget.border.color)" /><Variable name="post.border.bevel.color" description="Bevel Color" type="color" default="$(widget.border.color)"/></Group><Group description="Gadget Title" selector="h2"><Variable name="widget.title.font" description="Font" type="font" default="normal bold 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="widget.title.text.color" description="Text Color" type="color" default="$(body.text.color)"/></Group><Group description="Gadget Text" selector=".sidebar .widget"><Variable name="widget.font" description="Font" type="font" default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/><Variable name="widget.text.color" description="Text Color" type="color" default="$(body.text.color)"/><Variable name="widget.alternate.text.color" description="Alternate Color" type="color" default="#666666"/></Group><Group description="Gadget Links" selector=".sidebar .widget"><Variable name="widget.link.color" description="Link Color" type="color" default="$(link.color)"/><Variable name="widget.link.visited.color" description="Visited Color" type="color" default="$(link.visited.color)"/><Variable name="widget.link.hover.color" description="Hover Color" type="color" default="$(link.hover.color)"/></Group><Group description="Gadget Background" selector=".sidebar .widget"><Variable name="widget.background.color" description="Background Color" type="color" default="#141414"/><Variable name="widget.border.color" description="Border Color" type="color" default="#222222"/><Variable name="widget.border.bevel.color" description="Bevel Color" type="color" default="#000000"/></Group><Group description="Sidebar Background" selector=".column-left-inner .column-right-inner"><Variable name="widget.outer.background.color" description="Background Color" type="color" default="transparent" /></Group><Group description="Images" selector=".main-inner"><Variable name="image.background.color" description="Background Color" type="color" default="transparent"/><Variable name="image.border.color" description="Border Color" type="color" default="transparent"/></Group><Group description="Feed" selector=".blog-feeds"><Variable name="feed.text.color" description="Text Color" type="color" default="$(body.text.color)"/></Group><Group description="Feed Links" selector=".blog-feeds"><Variable name="feed.link.color" description="Link Color" type="color" default="$(link.color)"/><Variable name="feed.link.visited.color" description="Visited Color" type="color" default="$(link.visited.color)"/><Variable name="feed.link.hover.color" description="Hover Color" type="color" default="$(link.hover.color)"/></Group><Group description="Pager" selector=".blog-pager"><Variable name="pager.background.color" description="Background Color" type="color" default="$(post.background.color)" /></Group><Group description="Footer" selector=".footer-outer"><Variable name="footer.background.color" description="Background Color" type="color" default="$(widget.background.color)" /><Variable name="footer.text.color" description="Text Color" type="color" default="$(body.text.color)" /></Group><Variable name="title.shadow.spread" description="Title Shadow" type="length" default="-1px"/><Variable name="body.background" description="Body Background" type="background" color="$(body.background.color)" default="$(color) none repeat scroll top left"/><Variable name="body.background.gradient.cap" description="Body Gradient Cap" type="url" default="none"/><Variable name="body.background.size" description="Body Background Size" type="string" default="auto"/><Variable name="tabs.background.gradient" description="Tabs Background Gradient" type="url" default="none"/><Variable name="header.background.gradient" description="Header Background Gradient" type="url" default="none" /><Variable name="header.padding.top" description="Header Top Padding" type="length" default="22px" /><Variable name="header.margin.top" description="Header Top Margin" type="length" default="0" /><Variable name="header.margin.bottom" description="Header Bottom Margin" type="length" default="0" /><Variable name="widget.padding.top" description="Widget Padding Top" type="length" default="8px" /><Variable name="widget.padding.side" description="Widget Padding Side" type="length" default="15px" /><Variable name="widget.outer.margin.top" description="Widget Top Margin" type="length" default="0" /><Variable name="widget.outer.background.gradient" description="Gradient" type="url" default="none" /><Variable name="widget.border.radius" description="Gadget Border Radius" type="length" default="0" /><Variable name="outer.shadow.spread" description="Outer Shadow Size" type="length" default="0" /><Variable name="date.header.border.radius.top" description="Date Header Border Radius Top" type="length" default="0" /><Variable name="date.header.position" description="Date Header Position" type="length" default="15px" /><Variable name="date.space" description="Date Space" type="length" default="30px" /><Variable name="date.position" description="Date Float" type="string" default="static" /><Variable name="date.padding.bottom" description="Date Padding Bottom" type="length" default="0" /><Variable name="date.border.size" description="Date Border Size" type="length" default="0" /><Variable name="date.background" description="Date Background" type="background" color="transparent" default="$(color) none no-repeat scroll top left" /><Variable name="date.first.border.radius.top" description="Date First top radius" type="length" default="$(widget.border.radius)" /><Variable name="date.last.space.bottom" description="Date Last Space Bottom" type="length" default="20px" /><Variable name="date.last.border.radius.bottom" description="Date Last bottom radius" type="length" default="$(widget.border.radius)" /><Variable name="post.first.padding.top" description="First Post Padding Top" type="length" default="0" /><Variable name="image.shadow.spread" description="Image Shadow Size" type="length" default="0"/><Variable name="image.border.radius" description="Image Border Radius" type="length" default="0"/><Variable name="separator.outdent" description="Separator Outdent" type="length" default="15px" /><Variable name="title.separator.border.size" description="Widget Title Border Size" type="length" default="1px" /><Variable name="list.separator.border.size" description="List Separator Border Size" type="length" default="1px" /><Variable name="shadow.spread" description="Shadow Size" type="length" default="0"/><Variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left"/><Variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right"/><Variable name="date.side" description="Side where date header is placed" type="string" default="$(endSide)"/><Variable name="pager.border.radius.top" description="Pager Border Top Radius" type="length" default="$(widget.border.radius)" /><Variable name="pager.space.top" description="Pager Top Space" type="length" default="1em" /><Variable name="footer.background.gradient" description="Background Gradient" type="url" default="none" /><Variable name="mobile.background.size" description="Mobile Background Size" type="string" default="$(body.background.size)"/><Variable name="mobile.background.overlay" description="Mobile Background Overlay" type="string" default="transparent none repeat scroll top left"/><Variable name="mobile.button.color" description="Mobile Button Color" type="color" default="#ffffff" /></SkinVariables> Error 500 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.