Joomla Extensions Club 20,483 posts

[Chase Jestley Friend Chase JestleyJoin date: October 2015Posts: 114Downloads:122Uploads:3 Thanks: 15]

#1012662

I have the JA Comment component installed with the JA Oslo template.
It seems a bit clunky… actually, it looks horrible.
it definitely doesn’t look like the one in the documentation. the captcha is outta whack..
Is it possible that the extension is conflicting with the theme?
and can it start collapsed so it doesn’t detract from the look of the page?
http://prntscr.com/ebs0zd

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1012738

Hi,

You’re right, JA Oslo template doesn’t come with JA Comment component by default so it doesn’t provide any override style for it and it will load default style of JA Comment only.

You will need to customize some style for it, editor like Firebug in Firefox or Inspect Element in Chrome will be helpful in this case.

Regards

[Chase Jestley Friend Chase JestleyJoin date: October 2015Posts: 114Downloads:122Uploads:3 Thanks: 15]

#1013428

Awesome… now I just have to hack the code to make it look half-assed decent without blowing up the site as usually happens…

Question 1: so how do I adjust the line spacing?
Question 2: how do I load the comment section collapsed?
Question 3: how do I fix the typo in the "CLick to collapse" hyperlink (even a button would be nice)
Question 4: how do I fix the alignment on the Captcha?

Picture in the original post

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1013726

You can use Google chrome inspect element or Firebug for Firefox. What I usually do is set Compress CSS in Template manager to No, then hover on any HTML element (i.e. button, tag, text, …) you want and right click on it and then click on inspect element, it will show you which CSS class it is using and which CSS file and the path to this element on the right side. then you can go to the file and replace it with new CSS you change.

[Chase Jestley Friend Chase JestleyJoin date: October 2015Posts: 114Downloads:122Uploads:3 Thanks: 15]

#1014487

Wow… that’s less than helpful. no offence, but some a bit better guidance would be greatly helpful. it’s bad enough the extension looks like crap on the page – using JA template AND JA extension together. but then I have to hunt and peck through the coding to find errors in the ORIGINAL code?

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1014693

The point here is JA Comment is old extension which implemented long time ago, JA Oslo uses new technique with different system style.

You can try with this css rule:

#jac-wrapper #jac_image_captcha {
    margin-top: 27px;
}
#jac-wrapper .type_captcha {
    margin-left: 45px;
}
#jac-wrapper #textCaptcha {
    width: 170px;
}
#jac-wrapper li div.jac-addnew {
    margin-top: 10px;
}
#jac-copyright {
    font-size: 15px;
}

add into the file: ROOT/templates/your_default_template/css/custom.css (create this file if it doesn’t exist)

You can easily style some elements on your site with Firebug.

[Author]

Posts