Joomla Templates Club 406,261 posts

[stanpolman Friend stanpolmanJoin date: September 2009Posts: 18Downloads:6Uploads:2 Thanks: 5]

#172508

I have installed Teline iv and Joomla 1.7 quick set-up. There are two problems:

The first problem: When I insert a picture in an article, there is no space between the picture and the text.

In the demo I see in the html code:
<div><img class=”caption” src=”images/stories/….

And in the category overview the text and the picture is okay.

But when I insert a picture in a new article the html code is:
<p><img src=”images/stories/….

And there is no space between the picture and the text.

I can add class=”caption” manually, but that is not the intention, I suppose. What is the solution?

The second problem: The background (?) of ja-nws default layout is not white but grey. It has to be white as in the demo. How can I fix it?

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#432830

<em>@stanpolman 293298 wrote:</em><blockquote>I have installed Teline iv and Joomla 1.7 quick set-up. There are two problems:
The first problem: When I insert a picture in an article, there is no space between the picture and the text.
I can add class=”caption” manually, but that is not the intention, I suppose. What is the solution?</blockquote>
Can you provide a link to a page within your site that is displaying this particular problem?

<em>@stanpolman 293298 wrote:</em><blockquote>The second problem: The background (?) of ja-nws default layout is not white but grey. It has to be white as in the demo. How can I fix it?</blockquote>

This is actually an image used for the background – which can be found within /templates/ja_teline_iv/css/template.css

at line 453

#ja-container .main-inner1 {
background: url(../images/stripe-bg-2.png) #ddd;
margin: 0;
padding: 2px;
}

Simply remove the background image and (if necessary), set the color to #fff

[stanpolman Friend stanpolmanJoin date: September 2009Posts: 18Downloads:6Uploads:2 Thanks: 5]

#432840

You can see it at http://www.dedigitalemeergids.nl/index.php/nieuws/nieuws-uit-oostelijk-amsterdam/algemeen-nieuws

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#432841

<em>@stanpolman 293317 wrote:</em><blockquote>You can see it at http://www.dedigitalemeergids.nl/index.php/nieuws/nieuws-uit-oostelijk-amsterdam/algemeen-nieuws</blockquote>

Okay, I set “Optimize CSS” to “No” within your Template Manager–General Settings (so I could try to better identify the CSS you need to work with). You can setit back to “Join & Minify” when we are through working on this issue.

I am no entirely certain if this is the absolute correct CSS file (as I believe “addon.css” often refers to compressed css (though don’t quote me on that)) . . . but it’s worth a shot . . .

Within your template file structure, look and see if you can find the following –>
/plugins/system/jat3/jat3/base-themes/default/css/addon.css

if “addon.css” is there, look at lines 19-38

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0px;
border: 0;
/*font-size: 100%; -- Keeping the default behavior on font aesthetic*/
/*font: inherit; -- Keeping the default behavior on font aesthetic*/
/*vertical-align: baseline;*/
}


change the “padding” property to “padding-right: 10px;” – so it will look as follows:

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding-right: 10px;
border: 0;
/*font-size: 100%; -- Keeping the default behavior on font aesthetic*/
/*font: inherit; -- Keeping the default behavior on font aesthetic*/
/*vertical-align: baseline;*/
}

SAVE CHANGES – CLEAR CACHE – REFRESH PAGE

Let me know if this is close to the result you are hoping for.

[stanpolman Friend stanpolmanJoin date: September 2009Posts: 18Downloads:6Uploads:2 Thanks: 5]

#432849

Thanks Tom,
Issue one has fixed.

But nothing changed with the pictures and the text. The padding setting does not work.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#432850

<em>@stanpolman 293329 wrote:</em><blockquote>Thanks Tom,
Issue one has fixed.

But nothing changed with the pictures and the text. The padding setting does not work.</blockquote>
So you were able to find that css file (addon.css) ??

1 user says Thank You to TomC for this useful post

1. stanpolman

[stanpolman Friend stanpolmanJoin date: September 2009Posts: 18Downloads:6Uploads:2 Thanks: 5]

#432904

Yes, I found it and I have changed te code. But nothing changed at the front-end.

[stanpolman Friend stanpolmanJoin date: September 2009Posts: 18Downloads:6Uploads:2 Thanks: 5]

#433105

Still always I have a problem with publishing pictures.

Whem I insert a picture with the text editor by myself the picture will be published without space between the text and the picture. When I look at the html code in the text editor I see:

<p><img src=”images/stories/….

But when I look at the html code in the text editor of the demo articles already are in Teleine iv Joomla 1.70 I have downloaded, the html code is:

<div><img class=”caption” src=”images/stories/….

My concrete question is: how can I publish pictures without adjusting the html code every time?

[Author]

Posts