Creation of forums for your blogger (Blogspot) becomes very eazy today . if you want to create one as the image you see above, just follow the steps below:
1. Create and publish a new
static page on your blog, exclusively for a forum.
check out my forums-static-page here, just for example:
http://nadori-news.blogspot.com/p/forums.html
2. Create a new forum by Signing to
Free Forums at Nabble .then activate your account via registred e-mail within this site
3.1 Click on " Embedding Options " like in the image bellow:
3.2 Copy the javascript code generated in the widow after:
4. Go to Blogger Dashboard -> Design -> Edit HTML and mark the tick-box "Expand Widget Tempaltes".
5. Find (CTRL+F) this code, in your template:
<div id='content-wrapper'>
6. If you don't find the above mentioned code, then search for (CTRL+F) this one (
for new templates made for Blogger Template Designer)
<div class='columns fauxcolumns'>
7. immediately ABOVE / BEFORE it, paste the code you got from Nabble, with this ADDITIONAL code (Highlighted in
BLUE and
RED):
<b:if cond='data:blog.url == "http://nadori-news.blogspot.com/p/forums.html"'>
PASTE_CODE_FROM_NABBLE_HERE
</b:if>
NB1 : Replace the code in RED, with the link to your forum-page
8. Save your temaplate.
++++
The step below will HIDE everything from your blog (post content, sidebar widgets etc.) and ONLY forum will be visible in your forum-page. ++++
9. Find this code in your template:
</head>
10. ABOVE/BEFORE it, paste this code:
<b:if cond='data:blog.url == "http://nadori-news.blogspot.com/p/forums.html"'>
<style type='text/css'>
#content-wrapper {
display:none !important;
}
.columns, .fauxcolumns {
display:none !important;
}
</style>
</b:if>
NB 2 : Replace the code in RED, with the link to your forum-page
11. save and view your new forums
NOTE: to replace an entire blog with a forum, as shown in the first example (Forum In A Blogger Blog), then, first create a new blog. Download the template as a backup. Now, replace everything between the BODY tags in the template:
...
<body>
...
...
...
</body>
...
with the code copied from Nabble. So your template, code will look something like this:
it will seem like this:
...
<body>
<a id="nabblelink" href="http://nadori-news-forums.******.n4.nabble.com/">nadori-news-forums</a>
<script src="http://nadori-news-forums.******.n4.nabble.com/embed/f******"></script>
</body>
...
Save the template and enjoy.