Icy Phoenix

     
 


Post new topic  Reply to topic 
Page 1 of 2
Goto page 1, 2  Next
 
Reply with quote Download Post 
Post Countdown Breaking The Template 
 
Hello friends I'm trying to put that countdown in a custom block below the banner on my forum, this is the same countdown that has the portal phpbb3bbcodes. I downloaded the file lwtCountdown-htm and sent the folders images, js and style to the root folder of the forum (on localhost), I edited the file code index.html contained in the folder and renamed to countdown.html (code below) and sent to the folder styles/Milky_way/template, in the file overall_header.html I added <! - INCLUDE countdown.html -> below <! - INCLUDE menu_block.html ->, this worked but the template of the forum was aligned in the center (image below).


countdown.html
Code: [Download] [Hide] [Select]
<div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><div class="tbl-title"><!-- title --></div></div></div></div>
<table class="tablebg" width="100%" cellpadding="0" cellspacing="0">
<script language="Javascript" type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script language="Javascript" type="text/javascript" src="js/jquery.lwtCountdown-1.0.js"></script>
<script language="Javascript" type="text/javascript" src="js/misc.js"></script>
<link rel="Stylesheet" type="text/css" href="style/main.css"></link>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<font size="5" color="#0000FF"><strong> Texto acima do contador </strong></font><br />
        
<!-- Countdown dashboard start -->
    <div id="countdown_dashboard" style="text-align: center; margin: 0 auto;">
    <div class="dash weeks_dash">
        <span class="dash_title">semanas</span>
        <div class="digit">0</div>
        <div class="digit">0</div>
    </div>

    <div class="dash days_dash">
        <span class="dash_title">dias</span>
        <div class="digit">0</div>
        <div class="digit">0</div>
    </div>

    <div class="dash hours_dash">
        <span class="dash_title">horas</span>
        <div class="digit">0</div>
        <div class="digit">0</div>
    </div>

    <div class="dash minutes_dash">
        <span class="dash_title">minutos</span>
        <div class="digit">0</div>
        <div class="digit">0</div>
    </div>

    <div class="dash seconds_dash">
        <span class="dash_title">segundos</span>
        <div class="digit">0</div>
        <div class="digit">0</div>
    </div>

</div>
<!-- Countdown dashboard end -->

<script language="javascript" type="text/javascript">
    jQuery(document).ready(function() {
        $('#countdown_dashboard').countDown({
            targetDate: {
                'day':         7,
                'month':     9,
                'year':     2012,
                'hour':     11,
                'min':         0,
                'sec':         0
            }
        });
        
        $('#email_field').focus(email_focus).blur(email_blur);
        $('#subscribe_form').bind('submit', function() { return false; });
    });
</script>

<span class="corners-bottom"></span><br />
<tr><td class="cat-bottom"></td></tr>
</table>
<div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c"></div></div></div>


To centralize the countdown I changed the file
style/main.css
Code: [Download] [Hide] [Select]
#countdown_dashboard {
    height: 110px;
}


changed to:
Code: [Download] [Hide] [Select]
#countdown_dashboard {
height: 110px;
margin: 100px auto;
width: 700px;
}


This change centralizes the countdown but the template (bottom of the image) is broken and can not fix without removing the countdown, someone can help me please?

countdown.jpg
Description:  
Filesize: 243.73 KB
Viewed: 119 Time(s)

countdown.jpg


 



 
The CrowSend private message  
Back to topPage bottom
Icy Phoenix is an open source project, you can show your appreciation and support future development by donating to the project.

Support us
 
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
<!-- Countdown dashboard start -->
    <div id="countdown_dashboard" style="text-align: center; margin: 0 auto;">

Make that:

text-align: left;

Or simply remove

text-align: center;

And ALL of this should be in the header before </head> and the paths set accordingly.

Code: [Download] [Hide] [Select]
<script language="Javascript" type="text/javascript" src="js/jquery-1.4.1.js"></script>
<script language="Javascript" type="text/javascript" src="js/jquery.lwtCountdown-1.0.js"></script>
<script language="Javascript" type="text/javascript" src="js/misc.js"></script>
<link rel="Stylesheet" type="text/css" href="style/main.css"></link>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />


Also there is no such thing as </link>

It's,

<link rel="stylesheet" type="text/css" href="style/main.css" />

Edit:

You can also remove all of these:

language="Javascript"
____________________________________

And while your at it - - -  

You could remove this:

Code: [Download] [Hide] [Select]
<script language="javascript" type="text/javascript">
    jQuery(document).ready(function() {
        $('#countdown_dashboard').countDown({
            targetDate: {
                'day':         7,
                'month':     9,
                'year':     2012,
                'hour':     11,
                'min':         0,
                'sec':         0
            }
        });
        
        $('#email_field').focus(email_focus).blur(email_blur);
        $('#subscribe_form').bind('submit', function() { return false; });
    });
</script>


REMOVE THESE from it
<script language="javascript" type="text/javascript">
</script>

And use the rest to create a .js file called countdown.js and put it in the same place as the other .js files

Then call it with this where you removed it from.

<script type="text/javascript" src="PATH TO SCRIPT/countdown.js"></script>

Because it's not nice to have raw javascript in the html if it can be avoided.

 
 



 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
Thank mort, your tip did not solve the problem but helped me improve the codes of the countdown, which solved the problem was to delete the rows below the main.css file, now the countdown is already on the my online forum. what I want now is to fix the block borders the countdown to stay in standard milk way, I appreciate any hint about it?

find and delete on the file main.css
Code: [Download] [Hide] [Select]
body {
    text-align: center;
}

 



 
The CrowSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
If you had posted the whole "main.css" it would have been obvious to me where the problem was.

One needs to be careful that there are no conflicting anchors in any .css they add to their styles because whichever .css gets read "Last" will be the one that will be applied to the whole theme.

As for your other question, you have two different image paths for the different "headers" ?

/forum/styles/milky_way/theme/images/tbl_h_l.gif
and
/forum/styles/milky_way/theme/images/bg_th.gif


So obviously the wrong vars (if any) are in place, or the MOD markup is wrong for the theme - and as I don't have phpBB3 installed or the MOD - I'll leave it to one of the phpBB3 freaks to help you sort it out.
 



 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
I've had only a quick read TBH and I think for starters you did not fully understand Mort's suggestions.
The way it looks to me now is that you have 2 heads in use (one in overall_header and possibly one in the new included file)
The head code you now possibly have in the new included file should really be added in overall_header (between the head tags) and remove the double head tags you have added.

Further you should probably add the new include below:
Code: [Download] [Hide] [Select]
<div id="wrapcentre">


then you replace:
Code: [Download] [Hide] [Select]
<div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><div class="tbl-title"><!-- title --></div></div></div></div>

by this:
Code: [Download] [Hide] [Select]
<div><div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><div class="tbl-title"><h4>Texto acima do contador</h4></div></div></div></div>


and replace:
Code: [Download] [Hide] [Select]
<div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c"></div></div></div>

by this:
Code: [Download] [Hide] [Select]
<div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c"></div></div></div></div>


Last but not least you really need to update your style to match your phpbb3 version (but this is not related to your problem )

Goodluck and let us know how it worked out,
..The Freak?  
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
PS ... since i made you add "Texto acima do contador" to the title area of the block you should also remove:

Code: [Download] [Hide] [Select]
<font size="5" color="#0000FF"><strong> Texto acima do contador </strong></font><br />

 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
mort wrote: [View Post]
As for your other question, you have two different image paths for the different "headers" ?

/forum/styles/milky_way/theme/images/tbl_h_l.gif
and
/forum/styles/milky_way/theme/images/bg_th.gif


So obviously the wrong vars (if any) are in place, or the MOD markup is wrong for the theme - and as I don't have phpBB3 installed or the MOD - I'll leave it to one of the phpBB3 freaks to help you sort it out.


I think this is purely portal related, there's not many sites that fully adjust portals to follow the forum-style  
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
When one sees useless markup like this.

<span style="float: center"> one has to wonder if any of it is any good?  


Anyway, going with the existing markup (view-source) This should be awful close to making it the same as the rest of the portal.  

Spoiler: [ Show ]

 



 
Last edited by mort on Wed 29 Aug, 2012 15:47; edited 3 times in total 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
Problem to that Mort, this counter is shown both in portal and forum pages, so if it matches the portal it won't match the other pages and vice versa  
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
Well, if it's being hooked into both phpBB3 and the stand-alone Portal for it, Then he's got problems. Because the whole portal would no doubt have to be re-written for Milky Way markup?

Or create some IF & ELSE arguments to accommodate both.

 

Edit:

Wait a minute, he's only pulling this.

<!-- Countdown dashboard start -->

BLAH!

<!-- Countdown dashboard end -->


So you can have two sets of markup (templates).

One for the Portal, and one for the forum etc.  
 



 
Last edited by mort on Wed 29 Aug, 2012 15:23; edited 2 times in total 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
It just means every single portal block needs a few edits, but like I said ...not many webmasters do it the way it should be done

PS. offcours you are right about the " float center" thingy  
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
Read my edited post.
 



 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
I did  

What you suggest is surely possible but it doesn't create the unity it needs IMHO   (unless we don't care about it at all)
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
The penny just dropped.  

I trust you mean he wants the portal to look the same as the Milky Way theme, and not the block he added to look the same as the rest of the portal. ?

Must be getting late!, or I'm getting too old for this?  
 



 
mortSend private message  
Back to topPage bottom
Reply with quote Download Post 
Post Re: Countdown Breaking The Template 
 
Hehehehe I'm in a different timezone

I think most important to The Crow is the width of the counter block (and maybe the vertical position), which is why I posted the edits above.

If he would like to correct the portal to follow the style then that would be a different topic.
 




____________
www.DutchaGoGo.com (development/under construction ...Forever?¿?)
 
Joshua203Send private messageVisit poster's website  
Back to topPage bottom
Post new topic  Reply to topic  Page 1 of 2
Goto page 1, 2  Next


Display posts from previous:    

HideWas this topic useful?

Link this topic
URL
BBCode
HTML




 
Permissions List
You cannot post new topics
You cannot reply to topics
You cannot edit your posts
You cannot delete your posts
You cannot vote in polls
You cannot attach files
You can download files
You cannot post calendar events