New Wikidot Twitter Widget..CSS3 Style!

By Matt GentileMatt Gentile

This is the Latest Project from Console Zoom. It is a custom Wikidot CSS3 style twitter widget. There is going to be a tutorial and code in order to place this in your wikidot site, or any other site!

Step 1:

  • To get this code to work and be able to see the full features of it, you are going to need a CSS3-capable Internet browser (e.g. Apple Safari, Google Chrome). This is to really see what this widget can do.

Step 2:

  • Once you have downloaded the Chrome Browser or the Safari Browser you can now enter the code below into the bottom of the desired page that you want (NOT THE CSS STYLESHEET!!). Please note that you must copy and paste the Entire Code if you want to keep this feature free for Wikidot user's.

How to Install

To install this package in your site, use this code:
(replace the default values with your own, or delete any of the attributes completely)

[[include :csi:include:twitter-widget |width=2 |height=2 |username=wikidot |scrollbar=true ]]

Attribute Description Possible values Default value
width Width of widget, in hundreds of pixels Any integer 2 (which means 200px)
height Height of widget, in hundreds of pixels Any integer 2 (which means 200px)
username Your Twitter.com username Any valid twitter username wikidot
scrollbar Sets whether the scrollbar is shown or not true, false true

Note: To use the default value, just delete that attribute from the code.

View the Wikidot Syntax Here

View the CSI Package Here

Best Way to use This

Example:


If you look at the Console Zoom side bar while viewing the home page or the blog pages, that is what this widget should look like.
Any further questions on how to get this widget working in your site feel free to comment on this post or comment on the original blog pose HERE.


Thanks to tsangk for this great snippet: conditional-blocks


text above inserted with:

[[include :snippets:if START |unique=1|type=equal|var1=%%name%%|var2=conditional-blocks]]
**##red|Thanks to tsangk for this great snippet:##** [[[code:conditional-blocks]]]
[[include :snippets:if END]]



Other snippets posted by Matt Gentile

New Tabview - 24 Oct 2011 23:53


Rate this solution

If you think this solution is useful — rate it up!

rating: +2+x
Add a New Comment
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License