Contagem regressiva no portal

[The Crow]

Qual a URL do seu fórum: http://www.afroditep2pshare.org
Tipo de Hospedagem: Pago
Qual a versão do phpBB: phpBB 3.0.10
É um novo ou uma conversão: Update de uma versão phpBB3
Usuário de teste: Usuário: Senha:
Estilos instalados: Milky Way
Modificações instaladas: mChat 1.3.5, Who Was Here 1.2.1
phpBB-Gallery 1.1.6
Precise Similar Topics II 1.1.6
Board3 Portal 2.0.0
Advanced BBCode Box 3.0.11
Qual seu nivel de experiência: Intermediario
Quando começou o problema: É só uma intenção
Descreva seu problema: Olá amigos estou tentando colocar essa contagem regressiva em um bloco personalizado do Board Portal do meu site ou no viewtopic abaixo do banner do site mas ta complicado pra mim, é a mesma que tem no portal do phpbb3bbcodes, confesso que nem sei bem por onde começar, se alguém puder me ajudar esse é o link de download jquery_countdown, agradeço qualquer ajuda.

[robra]

Cara... é o seguinte:
O download tem de ser feito da versão HTML e não da verão PHP que você passou o link. Na página do contador regressivo que você passou, a http://ofertaweb.ro/demos/cool_jquery_countdown/light/, no final dela tem o texto "Original copyright here: little web things". Clique no link "little web things" da frase anterior e na página que carregar, onde tem escrito "DOWNLOADS", clique no link "HTML Under Construction page (.zip)" para fazer o download da versão HTML do contador regressivo.
Aí, vamos ao passo-a-passo:
1) Descompacte o arquivo lwtCountdown-html.zip baixado.
2) Renomeie o arquivo lwtCountdown-html\index.html para crono.html.
3) Abra o arquivo crono.html com o Notepad++:
A)>> Ache as linhas...

Código: Selecionar todos

<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>

... e as substitua por:

Código: Selecionar todos

<script language="Javascript" type="text/javascript" src="../forum/js/jquery-1.4.1.js"></script>
    <script language="Javascript" type="text/javascript" src="../forum/js/jquery.lwtCountdown-1.0.js"></script>
    <script language="Javascript" type="text/javascript" src="../forum/js/misc.js"></script>
    <link rel="Stylesheet" type="text/css" href="../forum/style/main.css"></link>

B)>> Ache as linhas...

Código: Selecionar todos

targetDate: {
                        'day':         10,
                        'month':     1,
                        'year':     2011,
                        'hour':     11,
                        'min':         0,
                        'sec':         0
                    }

... e as substitua por:

Código: Selecionar todos

targetDate: {
                        'day':         18,
                        'month':     2,
                        'year':     2013,
                        'hour':     22,
                        'min':         0,
                        'sec':         0
                    }

4) Faça upload do arquivo crono.html e das pastas \js e \style para o diretório /forum.
5) Faça upload dos arquivos da pasta lwtCountdown-html\images para o diretório forum/images.
6) Acesse o endereço http://www.afroditep2pshare.org/forum/crono.html e... voilá !! O contador regressivo estará funcionando.

OBSERVAÇÕES:
- Para alterar a contagem, é só alterar os valor nas linhas do item 3-B.
- Para inserir o contador regressivo em uma página é só abrir o arquivo crono.html no Notepad++ e copiar as linhas, incluindo o script, e colar na página desejada. Se quiser colocar dentro de um bloco igual ao da página http://www.phpbb3bbcodes.com/portal.php, aí você tem de criar um bloco para o seu estilo e incluir as linhas do crono.html dentro dele. O bloco do phpbb3bbcodes com o contador regressivo é este:

Código: Selecionar todos

<div class="portallist">
	<div class="forabg">
		<div class="inner"><span class="corners-top"><span></span></span>
		<ul class="topiclist">
			<li class="header">
				<dl class="icon">
					<dt>PhpBB3 BBCodes 5 years Birthday</dt>
				</dl>
			</li>
		</ul>
		<div class="portaltrigger portalactive"><a href="#"></a></div>
		<div class="collapsethis">
		<ul class="topiclist forums">
			<li>
			<div style="width:auto; height:auto; padding:10px; margin:0px auto;">
		
			<div id="containercount">
				<div id="countdown_dashboard">
					<div class="dash weeks_dash">
						<span class="dash_title">weeks</span>
						<div class="digit"><div class="top" style="display: none; ">3</div><div class="bottom" style="display: block; ">3</div></div>
						<div class="digit"><div class="top" style="display: none; ">6</div><div class="bottom" style="display: block; ">6</div></div>
					</div>

					<div class="dash days_dash">
						<span class="dash_title">days</span>
						<div class="digit"><div class="top" style="display: none; ">0</div><div class="bottom" style="display: block; ">0</div></div>
						<div class="digit"><div class="top" style="display: none; ">6</div><div class="bottom" style="display: block; ">6</div></div>
					</div>

					<div class="dash hours_dash">
						<span class="dash_title">hours</span>
						<div class="digit"><div class="top" style="display: none; ">0</div><div class="bottom" style="display: block; ">0</div></div>
						<div class="digit"><div class="top" style="display: none; ">5</div><div class="bottom" style="display: block; ">5</div></div>
					</div>

					<div class="dash minutes_dash">
						<span class="dash_title">minutes</span>
						<div class="digit"><div class="top" style="display: none; ">1</div><div class="bottom" style="display: block; ">1</div></div>
						<div class="digit"><div class="top" style="display: none; ">8</div><div class="bottom" style="display: block; ">8</div></div>
					</div>

					<div class="dash seconds_dash">
						<span class="dash_title">seconds</span>
						<div class="digit"><div class="top" style="display: none; ">4</div><div class="bottom" style="display: block; ">4</div></div>
						<div class="digit"><div class="top" style="display: none; overflow: hidden; height: 38.836291778630574px; padding-top: 0px; margin-top: 0px; ">3</div><div class="bottom" style="display: block; overflow: hidden; height: 47.71857537691495px; ">4</div></div>
					</div>
				</div>
			</div>
			</div>
			</li>
		</ul>
		</div>
		<span class="corners-bottom"><span></span></span></div>
	</div>
	</div>

Com isso já dá pra se divertir em personalizar o seu contador regressivo !!

Abraço.

[The Crow]

Valeu robra, vou testar depois e dou um retorno, agora preciso tentar resolver um outro problema, estou reformulando o afroditep2pshare em localhost para o aniversário do site daqui a 12 dias mas depois de quase pronto descubro que quase tudo o que fiz está desfeito, por algum motivo edições de arquivos que foram feitas a dias atrás, de um dia pro outro estão desfeitas, já atualizei tudo quanto há no meu pc mas não resolveu, não é invasão e ninguém usa meu pc além de mim, to vasculhando a net em busca de um solução (desculpe o desabafo mas já é a tereceira vez em u mês), vou testar esse contador ainda hoje e dou um retorno, mais uma valeu pela ajuda..

[_Vinny_]

Você edita os arquivos do estilo via ACP?

[The Crow]

_Vinny_ quando eu comecei com o phpBB tive problemas fazendo isso e aprendi a lição, nunca mais repeti esse erro, normalmente eu instalo minhas MODs manualmente em localhost sempre usando o Notepad++ mas dessa vez como estou renovando todo o fórum e terei que reinstalar quase 30 MODs diferentes estou usando o Automod. Quando isso aconteceu pela primeira vez eu desconfiei do Notepad++ e o desinstalei, exclui a pasta do programa, fiz limpeza nos registros do PC, enfim removi qualquer vestígio da instalação anterior, reiniciei o pc e reinstalei a mais atual versão do Notepad++, três dias depois o problema se repetiu e perdi três dias de trabalho na frente do pc, agora já estou desconfiado do Automod mas reinstalar quase 30 MODs na mão vai ser complicado. Também pode ser o meu pc, sinceramente não sei o que pode ser, ser tiver alguma ideia pra ajudar pode mandar, valeu.

[_Vinny_]

Nunca tive problemas do tipo. Testo estilos quase diariamente, além dos meus estilos, também tenho meus MODs que nunca deram esse tipo de problema.

Não tenho ideia do que possa ser. :|

[robra]

Qual o seu sistema operacional ?
Se for windows XP ou algo do gênero, parece uma Restauração do Sistema programada ou automática ou algum vírus que ativa a Restauração do Sistema.
Esta restauração volta o sistema, incluindo os arquivos, às versões nas datas selecionadas.

Abraço.

[The Crow]

Eu uso o Win7 Ultimate atualizado, creio que não seja vírus porque meu Kaspersky é original e atualiza diariamente mas mesmo assim vou scanear pra ter certeza, pra ser Restauração programada outras coisa como programas recém instalados também seriam alterados mas nada disso aconteceu, na verdade ao que parece só os arquivos do fórum que eu estava preparando foram afetados, eu também nunca vi nada parecido com isso, to vasculhando a net pra tentar descobrir alguma coisa, se descobrir deixo registrado aqui, valeu.

[The Crow]

Testando em localhost deu certo até certo ponto, o problema é que quero centralizar o contador e não consigo e onde não devia centralizar acabou centralizado. O que fiz foi baixar o arquivo lwtCountdown-html e enviar as pastas images, js e style para a pasta raiz do fórum, criei o arquivo countdown.html (código abaixo) na pasta styles/milky_way/template e no arquivo overall_header.html inseri <!-- INCLUDE countdown.html -->, só o que falta mesmo é corrigir os alinhamentos.

countdown.jpg

countdown.html

Código: Selecionar todos

<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">
	<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>  

[_Vinny_]

Procura no codigo:

Código: Selecionar todos

<!-- Countdown dashboard start -->
<div id="countdown_dashboard">

Então na linha:

Código: Selecionar todos

<div id="countdown_dashboard">

Substitua com:

Código: Selecionar todos

<div id="countdown_dashboard" style="text-align: center; margin: 0 auto;">