Creating magazine template with post "side by side" in Artisteer
In this tutorial, I'll explain how to transform an Artisteer template so that posts appear in (narrower) columns, side-by side on home, archive and search pages, with a sidebar of the same width appearing on the right hand side of the posts.
1. .Log in to your dashboard--> layout- -> Edit HTML
2. .Click on "Expand Widget Templates"
3. Search (CTRL + F) :
.blog-pager{
4. And replace it with:
.blog-pager{
width: 600px;
padding-top: 10px;
clear: both;
align: center;
}
This will ensure the pager always spans the width of both post columns on non-item pages.
5.Search: ]]></b:skin> and after paste this code:
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<style>
.art-post {width: 327px; height: 320px; float: left; border: solid 1px #B7A971; overflow: hidden;}
</style>
</b:if>
</b:if>
Change the width and height with you own to align the posts.
6. Search:
.art-post
{
and remove the value of : position:
7. Save the template and your ready to go.
DEMO
If you have any useful tips to accompany this tutorial, or would simply like to leave a comment, please feel free to leave your message below.
IMPORTANT
THIS TRICK WORK ONLY WITH TEMPLATES MADE BY ARTISTEER 2.4 OR NEWER.
15 comments
this is amazing
thanks alot
:bow:
Glad that my tutorials helped you.
Hello! nice blog!
Thanks. Hope you find what you are looking for...
Thanks,
your posting
I have one doubt
my template transformed with post width its ok,
But it is not side by side
how to solve this issue
please clarify my doubt
regards
ram
india
Put a link to your blog to see what's the problem.
hii..
I have a problem that is
Unterminated string literal in [data: blog.pageType! = "static_page;] before 35
please visit my blog http://jtyrytry.blogspot.com/
I'm using Artisteer 2.6 to create the template
Can you help me to solve the issue..??
Are you sure you've write the code correctly? Copy the exact code and it will work.
Hi
I´ve written the exact code, but the result is all the post on the left side, and on the right free space. What am I doing wrong?
Thanks
Reduce the width on this line until the post will align right.
.art-post {width: 327px; height: 320px; float: left; border: solid 1px #B7A971; overflow: hidden;}
I've been looking for this every where thank you
Is any way to make it with more than two articels side by side?
Oooh it is ok it works also for more than two posts side by side.
Ok thanks
Yes. Just change the width and height on step 5.
Great, thanks
Click to Add a New Comment
Leave your comment
- If you're asking a question click the Subscribe By Email link, below the comment form, to be notified of replies.
- Do NOT add links to the body of your comment as they will not be published.
- Only the comments posted in ENGLISH will be approved.
- If you have a problem check first the comments , maybe you will find the solution there.