Joomla Templates Club 406,261 posts

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#139863

Hi,

I have just downloaded and installed Teline II (Quickstart installation). There seems to be a problem with the Hot Topics area.

1. There is no vertical space between the images (same with FF 3, IE 6 and Google Chrome)
2. The sliding dark panel drops to the bottom of the page (in IE6, a bit misaligned in Google Chrome & FF3)

Screenshot 1 (Chrome/FF3/IE7):

Screenshot 2 (IE 6)

Joomla 1.5.10
Teline II 1.6

Pls help. Thanks.

PS:
Just installed. Have not touched any of the admin settings.

[ccvpguy Friend ccvpguyJoin date: February 2009Posts: 72Downloads:0Uploads:5 Thanks: 29 Thanked: 10 times in 5 posts]

#299679

Take a look at this thread http://www.joomlart.com/forums/topic/jateline-ii-hot-topic-space-problem/ >>>>speclaiy answer #6.
Hope this helps.

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#299680

Hi hsyon,

I installed using QuickStart the prior Joomla 1.5.9 -Teline II v1.6 before the Joomla 1.5.10 came out. I then upgrade some of my sites to Joomla 1.5.10, but did not encounter the same problem that you showed in the images.

Is there a QuickStart Kit now for Joomla 1.5.10 -Teline II v1.6? or did you install Joomla 1.5.10 then the Teline II v1.6?

The first issue is more easily solve. This is what bugs me sometimes, when I looked at the revised CSS file for the Hot Topic, they changed the CSS for margin specification of the first CSS tag, and this explains the no spacing in between the images. I will post a detailed (step-by-step) outline (intended so I hope even other beginners who may encounter the same issue will understand) and link it here.

The aforementioned is minor issue though compared to the browser incompatibility, i.e., a misalignment, that you stated.

I asked above what version or whether you use the QuickStart Kit or did a sequential step of installation. I encountered similar problem, though rare. Since it is sometimes quite difficult to get a response here (only 14% are ever answered), I find it faster just to begin anew — because sometimes the problem may be random fidelity of transmission issues (during dowload or upload) causing a corrupted file; or even those during the installation.

It could be a bug in the latest version of Teline II (but hold this thought), it will be easier to resolve if it is a fidelity of transfer issue. Tthe latter is very difficult to resolve — like searching of a raw diamond in the riverbed to find the corrupted file — if not impossible.

Instead of waiting for a response, it takes me about five minutes tops — after everything is setup — to peform the QuickStart installation. And, when I encounter a problem like you did, I will also do another fresh download of the software.

You do not even have to discard what you installed right now, just :

*download a fresh software
*unpack
*find the QuickStart directory
*unpack
*rename the unpacked QuickStart
*upload the entire renamed QuickStart

If this will solve it, I am sure you already know how to change the configuration.php in the root directory of the new installed and working site, so that you can transfer it to the root directory (but do the aforementioned after removing your old installation by placingthe files and directories in a holding directory).

Cornelio
*******

<em>@hsyong 122274 wrote:</em><blockquote>Hi,

I have just downloaded and installed Teline II (Quickstart installation). There seems to be a problem with the Hot Topics area.

1. There is no vertical space between the images (same with FF 3, IE 6 and Google Chrome)
2. The sliding dark panel drops to the bottom of the page (in IE6, a bit misaligned in Google Chrome & FF3)

Screenshots (the first is from Chrome/FF3, the second from IE6):

Joomla 1.5.10
Teline II 1.6

Pls help. Thanks.

PS:
Just installed. Have not touched any of the admin settings.</blockquote>

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#299686

cgc0202,

Just downloaded the package a few hours ago. Installed using Quickstart.. everything at the same time (not Joomla first, then template)…. therefore I was thinkin that it should look exactly like the demo!

What I can see in the Joomla admin is 1.5.10

Well, will try to check out the CSS (it’ll probably be easier of all the browsers show the same problem.. IE 6 is worst.. the whole thing drops to the bottom)

Just tested with IE7 and it’s same as Google Chrome/FF3 (screenshot number 1 above)

Thanks. I’ll have a go with the CSS.

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#299692

Hi hsyong,

I wrote a detailed procedure that I hope will correct the first issue you raised — no spacing among the vertical image

Hot Topic Layouting issues, CSS files and tags
http://www.joomlart.com/forums/showpost.php?p=122293&postcount=4

and posted it as an example (response #4) in another thread

All you ever wanted to know to change the layout, image and text specifications
http://www.joomlart.com/forums/topic/all-you-ever-wanted-to-know-to-change-the-layout-image-and-text-specifications/

If you know your way around, just go near the end

********
The Hot Topic module actually is a very powerful module, when you learn more about it. There is a separate module for Hot Topic called “mod_jacatslwi ” found in the modules directory.

modules => mod_jacatslwi => (several files and another directory here)

to make you suffer further in this hunt, there is another directory inside

modules => mod_jacatslwi => ja_catslwi

where you find a special css file, ja.catslwi.css

modules => mod_jacatslwi => ja_catslwi => ja.catslwi.css

where you will actually find the specifications of the CSS tag that you needed to modify:

I have no access to my notebook computer, but if you examine the ja.catslwi.css file, the first CSS tag:

(name of CSS tag here)
{
margin: 0;
padding: 0;
etc.
}

Change the above to:

(name of CSS tag here)
{
margin: 0px 0px 10px 0px;
padding: 0;
etc.
}

the margins refer to the top, right, bottom and left margins, respectively. Thus, changing the bottom margin to 10px (or as you want provides a space between images.
********

If you are just beginning to understand layouting and CSS files and tags, it may be good to read the detailed procedure I oultined, in the first link above.

I understand about Internet Explorer, always a problem. In fact, from the reviews, the latest seems to be the getting worse, and definitely the worst among the last few releases.

I will try to install the version you have tonight or tomorrow, and check if I will encounter the same problem relevant to the second issue you raised. I am using a very old (almost 10yo iMac right now) because my chord to charge the battery of my MacBook (G4) short-circuited. I abused it too much since I bought it in 2003. I may have to replace the chord or might end up buying a new one. I hope not, I am trying to extend its life, untill the new Snow Leopard is more stable, which may be the second generation (next year)

Cornelio
_________
<em>@hsyong 122290 wrote:</em><blockquote>cgc0202,

Just downloaded the package a few hours ago. Installed using Quickstart.. everything at the same time (not Joomla first, then template)…. therefore I was thinkin that it should look exactly like the demo!

What I can see in the Joomla admin is 1.5.10

Well, will try to check out the CSS (it’ll probably be easier of all the browsers show the same problem.. IE 6 is worst.. the whole thing drops to the bottom)

Just tested with IE7 and it’s same as Google Chrome/FF3 (screenshot number 1 above)

Thanks. I’ll have a go with the CSS.</blockquote>

1 user says Thank You to cgc0202 for this useful post

1. hsyong

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#299775

Solutions:

1. Vertical spacing between Hot Topics images:
As detailed at http://www.joomlart.com/forums/topic/jateline-ii-hot-topic-space-problem/

File: modules/mod_jacatslwi/jacatslwi.css

.ja-catslwi {
margin:0 0 14px;
padding:0;
position:relative;
}

2. Partially hidden title (screenshot 1 above):
The height of the sliding panel (collapsed & expanded height) can be set to a fixed value in the admin.
Admin > Extensions > Module Manager > Hot Topic

(but it seems the demo site is different, as the collapsed height seems to adjust automatically to the title length.. )

3. All the sliding panels drop to bottom of page of IE6 (screenshot 2 above):

File: modules/mod_jacatslwi/jacatslwi.css

.ja-catslwi {
margin:0 0 14px;
padding:0;
height: 200px;
position:relative;
}

Additional height property for the DIV … as the sliding panel is positioned as RELATIVE, the parent container needs to have height/weight.

This is not the best solution but it works… and if i change the height in the admin, I’ll also need to remember to change the height in this CSS.

PS: I have compared this CSS file, and the jacatslwi.css of the demo site… definitely a lot of differences.

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#299798

Hi hsyong,

I am glad you resolved the issues.

<em>@hsyong 122394 wrote:</em><blockquote>Solutions:

1. Vertical spacing between Hot Topics images:
As detailed at http://www.joomlart.com/forums/topic/jateline-ii-hot-topic-space-problem/

File: modules/mod_jacatslwi/jacatslwi.css

.ja-catslwi {
margin:0 0 14px;
padding:0;
position:relative;
}
</blockquote>

I think you are missing a subdirectory here.

File: modules/mod_jacatslwi/jacatslwi.css.

The “position:relative;” gives some ideas on something. It might solve the problem I have when I use multiple Hot Topic modules.

<em>@hsyong 122394 wrote:</em><blockquote>

2. Partially hidden title (screenshot 1 above):
The height of the sliding panel (collapsed & expanded height) can be set to a fixed value in the admin.
Admin > Extensions > Module Manager > Hot Topic

(but it seems the demo site is different, as the collapsed height seems to adjust automatically to the title length.. )
.</blockquote>

Was the last comment after you added the height specification in the CSS tag, .ja-catslwi: height: 200px;? I wonder what happens if you unpublish the Hot Topic module. Do you have a blank 200px height or is it collapsible?

I think this addition overrides the values, like the imposed fixed height in the Hot Topic menu, and might have caused the problem you observed — “the collapsed height seems to adjust automatically to the title length”,

The main drawback of a fixed height specification in the CSS tag is that if you plan to have multiple Hot Topic modules (I speculated on this in some other threads) by fixing the height in the CSS, it does not give you a chance to vary the height in other Hot Topic modules via the Hot Topic menu.

I am not certain since I have not been using IE that much. From what I observed, the dimensions of the images would change proportionately. This is not evident in the Demo, because they have been rigged to have the same sizes. I observed this when I used

If you forget the IE issue for a second, can you try this without the addition of the height to the CSS tag, .ja-catslwi? Then check how the images behave in the other browsers?

I cannot access the CSS right, but if I remember correctly CSS tag, .ja-catslwi, included a fixed width — this will contain the title max width.

<em>@hsyong 122394 wrote:</em><blockquote>
3. All the sliding panels drop to bottom of page of IE6 (screenshot 2 above):

File: modules/mod_jacatslwi/jacatslwi.css

.ja-catslwi {
margin:0 0 14px;
padding:0;
height: 200px;
position:relative;
}

Additional height property for the DIV … as the sliding panel is positioned as RELATIVE, the parent container needs to have height/weight.

This is not the best solution but it works… and if i change the height in the admin, I’ll also need to remember to change the height in this CSS.
.</blockquote>

If this is unique for IE, this is the reason why I don’t like IE so much. Every webdesigner and internet programmers should unite to expose Microsoft deviating from accepted html and css standards. They did this a long time ago when they were certain of a virtual monopoly of the browsers.

<em>@hsyong 122394 wrote:</em><blockquote>
PS: I have compared this CSS file, and the jacatslwi.css of the demo site… definitely a lot of differences.</blockquote>

Yes, I observed this the other last weekend, rather by accident. The Hot Topic demo is based from the original jacatslwi.css — it had correct margin specifications to allow for the spacing between images. The first problem you observed should not have happened, if they did not change it. I do not know why the Joomlart webdesigners/scripters keep on changing the CSS tags specifications or does not consult prior working templates. And, to top it of, these changes are not indicated in the changelog.

You are lucky you did not start with a Teline II before the latest. They made a radical change in the contents and directories of some of the Teline II specific modules, including the mod_jacatslwi

Previous (before Teline II v1.6)

modules => mod_jacatslwi => mod_jacatslwi => jacatslwi.css

Latest: Teline II v1.6
modules => mod_jacatslwi => ja_jacatslwi => jacatslwi.css

and some of the files are different too. What was unfortunate is that Joomlart did not state in the changelog that there were significant changes. It is causing me problems to upgrade from previous. If I just write over the files (before I found out the above changes by accident).

You seem to be good at troubleshooting. Do you have some programming or scripting experience?

Cornelio

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#299810

>> I wonder what happens if you unpublish the Hot Topic module. Do you have a blank 200px height or is it collapsible?

No “blank” height.. the 200px is the height of the image. If I unpublish the module, then the whole block will be gone from the page.

>>If you forget the IE issue for a second, can you try this without the addition of the height to the CSS tag, .ja-catslwi? Then check how the images behave in the other browsers?

It works normally in other browsers. It’s IE which specifically needs a relatively positioned div to have height/width… else any absolute div inside that container div may behave unexpectedly.

>>If this is unique for IE, this is the reason why I don’t like IE so much.

IE has caused me to lose a lot of hair 😀

>>You seem to be good at troubleshooting. Do you have some programming or scripting experience?

Yes, I have been using PHP, XHTML, CSS for a number of years.. but quite new to Joomla. (I’m not very good with PHP tho.. juz the simple stuff)

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#299816

Hi hsyong,

<em>@hsyong 122438 wrote:</em><blockquote>>> I wonder what happens if you unpublish the Hot Topic module. Do you have a blank 200px height or is it collapsible?

No “blank” height.. the 200px is the height of the image. If I unpublish the module, then the whole block will be gone from the page.
</blockquote>

This is good to know. I suspected it will collapse properly if empty.

<em>@hsyong 122438 wrote:</em><blockquote>
>>If you forget the IE issue for a second, can you try this without the addition of the height to the CSS tag, .ja-catslwi? Then check how the images behave in the other browsers?

It works normally in other browsers. It’s IE which specifically needs a relatively positioned div to have height/width… else any absolute div inside that container div may behave unexpectedly.

>>If this is unique for IE, this is the reason why I don’t like IE so much.

IE has caused me to lose a lot of hair 😀
</blockquote>

Yeah, IE is very strick about image heights, and some other stuff. I use another browser to view my stuff, but when I used the browser compatibility test, almost all the IE versions had someting incorrect or another. I had to add position modules, for horizontal Hot Topic, to avoid the spill over than you observed here — no fixed height specification because I want to use the module menu to adjust them.

<em>@hsyong 122438 wrote:</em><blockquote>
>>You seem to be good at troubleshooting. Do you have some programming or scripting experience?

Yes, I have been using PHP, XHTML, CSS for a number of years.. but quite new to Joomla. (I’m not very good with PHP tho.. juz the simple stuff)</blockquote>

Just curious. Several of us found the Joomla 1.5.x-Joomlart template to be rather slow. So, we are trying to find ways to explore what could be done with the scripts and CSS, or some other features to further optimize the whole Joomla 1.5.x-Joomlart template, so that a site will load faster.

I am trying to entice people here with more scripting and webdesign background and/or experience if they might be interested in collaborating — more heads may provide more ideas.

Cornelio

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#299821

cgc0202,

I’ll definitely look into the optimization part later and share whatever I find.

As of now, the speed is acceptable (with QS data).. i installed on a subfolder of my current site (a restaurant directory). The restaurant diectory loads almost immediately, and Teline II loads about 1~3 seconds slower.

Haven’t done anything much yet — just removed the Media tab and enabled HTTP compression. The Joomla cache not enabled yet. Any significant performance enhancement if Joomla cache is enabled?

Read somewhere on this forum that Teline II waits for many seconds before it starts displaying anything in the browser. For me. it’s about 2 ~ 4 seconds. (caused by loading JS files ? …..subsequent page loads are almost immediate)

PS:
The server is located in my country so it’s quite fast for me. I have read some of the threads regarding speed, but I can’t comment much since most of the sites just won’t load (not just Joomla/Joomlart sites…. most oversea sites seem very slow these few days)

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#299836

<em>@hsyong 122449 wrote:</em><blockquote>cgc0202,

I’ll definitely look into the optimization part later and share whatever I find.

As of now, the speed is acceptable (with QS data).. i installed on a subfolder of my current site (a restaurant directory). The restaurant diectory loads almost immediately, and Teline II loads about 1~3 seconds slower.

Haven’t done anything much yet — just removed the Media tab and enabled HTTP compression. The Joomla cache not enabled yet. Any significant performance enhancement if Joomla cache is enabled?

Read somewhere on this forum that Teline II waits for many seconds before it starts displaying anything in the browser. For me. it’s about 2 ~ 4 seconds. (caused by loading JS files ? …..subsequent page loads are almost immediate)

PS:
The server is located in my country so it’s quite fast for me. I have read some of the threads regarding speed, but I can’t comment much since most of the sites just won’t load (not just Joomla/Joomlart sites…. most oversea sites seem very slow these few days)</blockquote>

Hi hsyong,

You must have fast connection in your country, if it takes 2-4 seconds only. Mainland China? I read here that the government of China have been blocking again. This was reported about You Tube. There is also the “worm” talked about.

One of my sites, used to average 15-20 seconds, after I added new positions, and actual articles with images, it slowed further. It is possible that the slow upload is due partly to using a very old (almost 6 years) notebook. It is even slower with the green egg shaped iMac.

What http compression did you perform?

If you have a restaurant page, with lots of images, turn on the gzip — it creates the specified thumbnail size which is smaller (kb) and I think also optimized.

I read Google saying how they enhanced the speed dramatically, at least the presentation of the text and layout structure, if the java scripts are placed at the bottom.

Yes, the cache would improve subsequent loading of a page but if I am not mistaken, there is already a cache default of 15 (min???).

Cornelio

[hsyong Friend hsyongJoin date: April 2009Posts: 11Downloads:0Uploads:0 Thanks: 2]

#299866

>> You must have fast connection in your country, if it takes 2-4 seconds only. Mainland China?

I’m from Malaysia :… on a 512K connection.. the broadband sucks here .. only sites on local server loads normally, oversea connection is dodgy at best.

Example, I’m trying to access Zen Cart forum now, and it’s still stuck at blank “white” page after 5 minutes.

>> One of my sites, used to average 15-20 seconds, after I added new positions, and actual articles with images, it slowed further.

I’m using the sample data.. so, it’s about 150 articles

>> What http compression did you perform?

Sorry, it’s the “GZIP Page Compression” from the Joomla admin (doesn’t seem to show much difference tho)

>> I read Google saying how they enhanced the speed dramatically, at least the presentation of the text and layout structure, if the java scripts are placed at the bottom.

Heard about that too, but if I put the javascripts at the bottom, what if a user click some of the function when javascript isn’t running or finish loading yet??

>> Yes, the cache would improve subsequent loading of a page but if I am not mistaken, there is already a cache default of 15 (min???).

I have not enabled the Joomla cache yet, it’s “off” by default right?

[Author]

Posts