I thought I was doing quite simple stuff by creating a new page type based on the page.ss and adding a Twitter widget which comes from the Twitter site. There is some js in the code which comes from the Twitter site itself. The relevant bits of code are like this
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<% base_tag %>
$MetaTags
</head>
<body class="typography">
<div id="wrapper">
<div id="header">
<h1></h1>
</div>
<div id="menu">
<% include Navigation %>
</div>
<div id="content">
$Layout
</div>
<div id="sidebar">
<div id="feed"> <a class="feed-button" href="#"> </a> </div>
<% include SideNav %>
<div id="sidebar-bottom"> </div>
</div>
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 200,
height: 200,
theme: {
shell: {
background: '#bbfcf8',
color: '#030003'
},
tweets: {
background: '#b9f7f2',
color: '#050005',
links: '#05f7ef'
}
},
features: {
scrollbar: true,
loop: false,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'all'
}
}).render().setUser('Living_Inspired').start();
</script>
<div id="footer">
<div id="footer-valid">
<% include Footer %>
</div>
</div>
</div>
</body>
</html>
All I have added is the code between
<script> and </script>
The Twitter widget appears fine but now this code here doesn't appear to work.
<div id="sidebar">
<div id="feed"> <a class="feed-button" href="#"> </a> </div>
<% include SideNav %>
<div id="sidebar-bottom"> </div>
</div>
That while the sidebar appears the links on the sidebar are not working. It is as if there is some overriding <div> somewhere which is overwriting the code in the sidebar. But a check using Firebug doesn't reveal anything so I am at a loss how to fix this.
Any pointers gratefully accepted.
Thanks
Larry