Joomla Templates Club 406,261 posts

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#160081

I just setup a blog layout and put two articles in and the whole page looks nothing like the demo which uses a category blog layout and has a picture to the left with the border around it, as well as pictures not going over the line breaks. How can I get the blog layout to look like this?

http://www.joomlart.com/demo/#templates.joomlart.com/ja_rave

instead of this

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#376358

Try use in menu type as frontpage blog layout, instead

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#376572

Do you mean Category Blog? I tried Category Blog for the homepage, but then the css is lost and everything becomes different – no borders, alignment, etc.

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#376582

<em>@novajugo 221315 wrote:</em><blockquote>Do you mean Category Blog? I tried Category Blog for the homepage, but then the css is lost and everything becomes different – no borders, alignment, etc.

</blockquote>

Ok, You seem to refer to template for joomla 1.6 as I had given in reply for joomla 1.5 template

Please view screenshot where I have given the reference to be selected

Cheers

---

Attachments:

1. 

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#376599

Yes, I am using Joomla 1.6. The problem is that I want to show all articles in a news category, not just featured articles. Featured articles settings works fine in Ja Rave 1.6, but if I change to Category blog, then this happens.

I am not sure why you are pointing to the featured articles? Perhaps what I wrote above will solve any misunderstanding. I would like to show a whole category, but it loses css, in other words, I am asking how to get the same css layout for category blog as for featured articles.

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#376919

Basically, I would like to show all articles in the circled part of the picture below, but keep the same look. The problem is if I switch to category layout, the look of the articles/images breaks. Any idea how?

The picture below is what happens when I switch to Category Blog then add new articles:

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#377284

Try add this at end of template.css file::

.blog .items-leading .leading img{float:right;margin-left:10px;}

and change this::

.blog .leading, .blog-featured div.haveimage {template.css (line 280)
padding-right: 140px;
position: relative;
}

to

.blog-featured div.haveimage {
padding-right: 140px;
position: relative;
}

and

.blog .leading{
position: relative;
}

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#377398

<em>@aman204 222270 wrote:</em><blockquote>

and change this::

.blog .leading, .blog-featured div.haveimage {template.css (line 280)
padding-right: 140px;
position: relative;
}

to

.blog-featured div.haveimage {
padding-right: 140px;
position: relative;
}

and

.blog .leading{
position: relative;
}
</blockquote>

Thanks Aman, but I don’t understand the last part. To me it seems as if you are asking me to change one line of code into two different parts of code. I also don’t have the exact line you are asking me to change. Here is my code around 280.

/* Article ---*/

.blog-featured .items-leading .leading, .blog .items-leading .leading {
position: relative;
}
.article-content { overflow: hidden; }

/* Meta ---*/
.article-tools { clear: both; display: block; position: relative; }

.article-tools div.actions { float: right; width: 22%; }

.article-tools div.actions span{ float: right; }

.blog-featured div.article-image { top: -5px; position: absolute; right: 0px; }

.blog-featured div.haveimage { padding-right: 140px; position: relative; }

.blog-featured div.haveimage img.img { margin: 0px !important; }

.blog-featured:hover h1.componentheading, .blog-featured:hover .componentheading,
.blog:hover h1.componentheading, .blog:hover .componentheading { border-color: #333; color: #333; }

.contact .inputbox {
background: #fff url(../images/content_bg.gif) repeat-x;
border: solid 1px #ccc;
padding: 3px;
}


[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#377408

<blockquote>To me it seems as if you are asking me to change one line of code into two different parts of code.</blockquote>

Yes, You are right 🙂
<blockquote>
I also don’t have the exact line you are asking me to change. Here is my code around 280.</blockquote>

I have given in references from demo template installed in my local install

Other way, Can you provide a link to your site

[Fokstrot Friend FokstrotJoin date: August 2009Posts: 87Downloads:0Uploads:0]

#377800

I sent the link to the url in a private message.

[aman204 Friend aman204Join date: January 2010Posts: 1945Downloads:0Uploads:43 Thanks: 11 Thanked: 418 times in 356 posts]

#377969

<em>@novajugo 222955 wrote:</em><blockquote>I sent the link to the url in a private message.</blockquote>

Few things please::

1) I would suggest you to please turn off css compression while the site is being debugged
2) Also, Can you please provide in ftp details to make changes as I couldnt find in-built ftp client extension in admin to make changes

Cheers

[Author]

Posts