Travis
Active member
Using Trombones13's Guide to adding Custom Sidebar Blocks , I thought I would have a go at adding Twitter Feeds to the Sidebar.
Style One:Twitter Feed
Style One:Twitter Feed
- First,go to http://twitter.com/about/resources/widgets/widget_profile and input your username and design it to your satisfaction. For best results,the dimensions should be set to width:225,height:300.When you have finished designing it,click "Finish & Grab code".Copy the code to your clipboard.
- Go to your Admin CP >> Appearance >> Templates >> Create New Template. Name the template whatever you want. For this example,I am calling it "twitter_feed".
- Paste the following into your template.
Code:
<div class="section">
<div class="secondaryContent">YOUR TWITTER CODE HERE </div>
</div>
*Remember to replace "YOUR TWITTER CODE HERE" with the code you have copied from the twitter page.
EXAMPLE CODE:
Code:
<div class="section">
<div class="secondaryContent">
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 225,
height: 300,
theme: {
shell: {
background: '#333333',
color: '#ffffff'
},
tweets: {
background: '#000000',
color: '#ffffff',
links: '#4aed05'
}
},
features: {
scrollbar: true,
loop: false,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'all'
}
}).render().setUser('TravisM661').start();
</script>
</div>
</div>
4. Save and Exit Template
5. Open "PAGE_CONTAINER" and find {xen:raw $sidebar}. Paste <xen:include template="name_of_your_custom_template" />.Immediately after it,Like this:
Code:
<!-- sidebar -->
<aside>
<div class="sidebar">
<xen:if is="!{$noVisitorPanel}"><xen:include template="sidebar_visitor_panel" /></xen:if>
{xen:raw $sidebar}
<xen:include template="twitter_feed" />
</div>
</aside>
</xen:if>