|
Page 1 of 2
|
The Crow
Joined: September 2009
Posts: 17
Location: Japan
|
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
<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
#countdown_dashboard {
height: 110px;
}
changed to:
#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?
Description: |
|
Filesize: |
243.73 KB |
Viewed: |
227 Time(s) |
|
|
#1 Wed 29 Aug, 2012 08:13 |
|
Sponsors
|
Icy Phoenix is an open source project, you can show your appreciation and support future development by donating to the project.
|
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
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.
<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:
<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.
|
#2 Wed 29 Aug, 2012 08:25 |
|
The Crow
Joined: September 2009
Posts: 17
Location: Japan
|
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
body {
text-align: center;
}
|
#3 Wed 29 Aug, 2012 12:07 |
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
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.
|
#4 Wed 29 Aug, 2012 12:35 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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:
then you replace:
<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:
<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:
<div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c"></div></div></div>
by this:
<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?¿?)
|
#5 Wed 29 Aug, 2012 13:37 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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:
<font size="5" color="#0000FF"><strong> Texto acima do contador </strong></font><br />
____________ www.DutchaGoGo.com (development/under construction ...Forever?¿?)
|
#6 Wed 29 Aug, 2012 13:40 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
Re: Countdown Breaking The Template
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?¿?)
|
#7 Wed 29 Aug, 2012 13:54 |
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
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.
<table class="tablebg" cellpadding="0" cellspacing="1" width="100%">
<tr>
<th> Contagem regressiva para o nosso 3° Aniversário </th>
</tr>
</table>
<table class="tablebg" cellspacing="1" width="100%">
<tr class="row1">
<td style="padding:5px 5px 5px 5px;">
<div class="postbody">
<div align="center">
<!-- 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 type="text/javascript" src="PATH TO SCRIPT/countdown.js"></script>
</div>
</td>
</tr>
</table>
Last edited by mort on Wed 29 Aug, 2012 15:47; edited 3 times in total |
#8 Wed 29 Aug, 2012 15:03 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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?¿?)
|
#9 Wed 29 Aug, 2012 15:08 |
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
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 |
#10 Wed 29 Aug, 2012 15:14 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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?¿?)
|
#11 Wed 29 Aug, 2012 15:18 |
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
Re: Countdown Breaking The Template
Read my edited post.
|
#12 Wed 29 Aug, 2012 15:22 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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?¿?)
|
#13 Wed 29 Aug, 2012 15:27 |
|
mort
Spam Basher
Joined: August 2010
Posts: 998
Location: Up a tree
|
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?
|
#14 Wed 29 Aug, 2012 15:33 |
|
Joshua203
Joshua 203
Dutch A Go Go
Joined: August 2008
Posts: 1754
Location: Earth, Europe, the Netherlands, Rotterdam
|
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?¿?)
|
#15 Wed 29 Aug, 2012 15:39 |
|
|
Page 1 of 2
|
Was this topic useful?
Was this topic useful?
Link this topic |
URL |
|
BBCode |
|
HTML |
|
Similar Topics
Similar Topics
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
|
|
|
|