Arquivo da tag: html

Retrospective: new plugin for WordPress

I’ve just wrote my first WordPress public plugin, that I’m licensing under GPL v3. This post is to make it public. I’m writing in English because the WordPress plugin directory asks me to provide a plugin page to host the files there and I’ll provide the URL of this post. Update: The plugin is now in the WordPress plugin directory: wordpress.org/extend/plugins/retrospective/


The website of the brazilian newspaper O Estado de São Paulo has a nice way to display news in a retrospective-style (check this screenshot or this link — Flash required).

Wouldn’t it be nice if we could display WordPress posts in our pages and categories in the same way just by using a shortcode? The possibilities are many. That’s why I wrote the Retrospective plugin for WordPress.

It has at least two advantages over the version you just saw:

  1. Does not require Flash (its implementation uses only CSS and JavaScript/jQuery)
  2. Has a option to respect the (time-)scale of the posts.

Its use is very simple. Wherever you add the shortcode [retrospective] the plugin will draw that cool retrospective. The shortcode supports several attributes:

  • count — limit the number of posts to be displayed (default = 10; use -1 to display all)
  • cat — display posts with category IDs comma-separated (default = display all posts)
  • width — the width of the timeline in pixels (default = 600)
  • delay — the time of the focus change animation in milisseconds (default = 1000)
  • scale — if set, respect the time scale in the distances between the points in the timeline (default = false)
  • image_width, image_height — the dimensions of the thumbnail images in pixels (default = 300×180)
  • image_border_size — the size of the image’s border in pixels (default = 7)
  • image_border_color — the color of the image’s border in hexa RGB (default = 000000)
  • image_margin — the space between the images (default = 5)
  • date_format — the date format in PHP format (default = d/m/Y)

For example, here is a [retrospective count=5 cat=20 image_border_color=2F5971] call:


Some screenshots

Here is a screenshot from juntos.org.br with scale=true (in the link you can see it working):

And here is a screenshot from a fresh WordPress install (TwentyEleven theme without modifications):


Customizing

Post thumbnails

For better results, I suggest always adding post thumbnails to your posts and using registered image sizes in image_width and image_height attributes.

Styling retrospectives

The generated HTML is very easy to style (but just be careful with margins and paddings, they’re set with !important attribute — I did it to try not to break with any theme). Here is a sample:

<div id="retro-uniquehash" class="retrospective">
    <!-- TIMELINE -->
    <ul class="time">
        <li rel="0"><a href="permalink" style="left:0px;"><span>date</span></a></li>
        <li rel="1"><a href="permalink" style="left:300px;"><span>date</span></a></li>
        <li rel="2"><a href="permalink" style="left:600px;"><span>date</span></a></li>
    </ul>
 
    <!-- PHOTOS -->
    <div class="photos">
        <ul>
            <li rel="0"><a href="permalink" title="title">
                <img src="file" class="wp-post-image" /></a></li>
            <li rel="1"><a href="permalink" title="title">
                <img src="file" class="wp-post-image" /></a></li>
            <li rel="2"><a href="permalink" title="title">
                <img src="file" class="wp-post-image" /></a></li>
        </ul>
    </div>
 
    <!-- POSTS -->
    <ul class="posts">
        <li rel="0"><a href="permalink" title="title"><h2>Title <span>(date)</span></h2>
            <p>Excerpt</p></a></li>
        <li rel="1"><a href="permalink" title="title"><h2>Title <span>(date)</span></h2>
            <p>Excerpt</p></a></li>
        <li rel="2"><a href="permalink" title="title"><h2>Title <span>(date)</span></h2>
            <p>Excerpt</p></a></li>
    </ul>
</div>

Styling a specific retrospective

The generated hash takes in consideration all the attributes sent to the shortcode and also how many retrospectives appeared before in the parsing of the actual page. I made it that way to allow users to set up two exactly equal retrospectives in the same page. Because of that, I don’t recommend setting styles for #retro-uniquehash. I think a reasonable solution for this issue is to make something like

<div id="something_that_makes_sense">[retrospective]</div>

when inserting the shortcode and then styling #something_that_makes_sense .retrospective.


Download

Here is the code for download:* retrospective.zip
* Warning: Please consider I’m using a bazaar approach here. Be aware that the plugin probably has a lot of bugs (and please tell me if you catch any).

I hope you enjoy it. Have fun and please let me have your feedback! :)

Web Authoring Statistics

ATENÇÃO: Este conteúdo foi publicado há 11 anos. Eu talvez nem concorde mais com ele. Se é um post sobre tecnologia, talvez não faça mais sentido. Mantenho neste blog o que escrevo desde os 14 anos por motivos históricos. Leia levando isso em conta.

Li hoje no feed do Google Code as estatísticas das tags mais usadas e como são usadas. É decepcionante ver:

  1. Que a tag head é mais comum que a html!
  2. A tag br está lá em cima, do lado de tags como table.
  3. A tag div é mais incomum do que a script
  4. … e por aí vai.

Aí depois ele vai falar dos elementos mais usados e seus atributos mais usados… Advinhem quais? Isso mesmo. body bgcolor, a target, table border width cellspacing cellpadding

Ah… Nem vou mais falar do resto. Vejam aqui: Google Web Authoring Statistics

Com estatísticas como essas, percebemos que a maioria dos webmasters em geral ainda não adotou um desenvolvimento semântico e aí eles tornam a internet esse lixo… :(

Novo design!

ATENÇÃO: Este conteúdo foi publicado há 11 anos. Eu talvez nem concorde mais com ele. Se é um post sobre tecnologia, talvez não faça mais sentido. Mantenho neste blog o que escrevo desde os 14 anos por motivos históricos. Leia levando isso em conta.

Novo template feito em tempo recorde… Três dias foram necessários para eu finalizar o novo design do meu site, agora mais leve e acessível (e mais bonito).

Com a folha de estilos CSS mais organizada, menos ícones, mais simplicidade, texto mais legível (com detalhes pouco aproveitados em muitos sites como line-height e text-indent) e um logo que o Cosme fez pra mim por caridade; espero que curtam o novo design e, se quiserem, sugiram mudanças!

Agora eu também fiz um arquivo de JavaScript já preparado para futuras aplicações Ajax e pretendo ir adicionando detalhes legais aos poucos.

Comentem dando as suas opiniões!

Álbum de Fotos

ATENÇÃO: Este conteúdo foi publicado há 11 anos. Eu talvez nem concorde mais com ele. Se é um post sobre tecnologia, talvez não faça mais sentido. Mantenho neste blog o que escrevo desde os 14 anos por motivos históricos. Leia levando isso em conta.

Link para projeto em desenvolvimento…

Meu Flickr tá estourando (depois de 200 fotos, começam a sumir fotos segundo seu FAQ) e por isso resolvi criar um álbum de fotos pessoal. Estou desenvolvendo em PHP, usando um banco de dados MySql e estou criando bastante recursos Ajax para exercitar um pouco e para o negócio ficar bem dinâmico (se estiver ficando muito exagerado, me avisem!). Este projeto que ainda não tem nome, mas que estou pensando em algo como PhotoX (gostou do nome? comente! não gostou? comente também!), deve ter todos os recursos do Flickr (tipo, All Sizes, Notes e Rotate) e o que surgir de idéias legais. Será um software livre, cada um instala em seu servidor (ex.: é um “WordPress“, não um “Blogger“) e por isso ele não tem limites de sets, tags, fotos, tamanhos ou qualquer coisa do tipo. Irá requerer PHP 4.3, está sendo desenvolvido usando classes (estou tentando exercitar programação orientada a objetos), usa a biblioteca GD (para trabalhar com as imagens) e é totalmente Web 2.0 (tableless, padrões HTML 4.01 Strict, Ajax, tagsonomia, simplicidade). Já estou o criando multi-linguagem, ele funciona com alguma coisa parecida com templates e deve sair em no máximo um mês.

Estou convidando programadores sem nada pra fazer pra me dar uma ajuda (claro que gratuita). O Gustavo é uma das pessoas que me deu uma ajuda fazendo um pedaço da classe Foto e da classe Comentario e aqui estendo o convite para qualquer pessoa que lê o meu blog e queira ajudar. O sistema é simples: eu te dou um login e senha no meu FTP e você desenvolve o que você conseguir (postando sempre que você muda uma letra o novo resultado, para que depois outra pessoa pegue e possa continuar).

Atualizado

O Renato deu uma idéia legal aí num comentário que é hospedar o troço em alguns desses sites de projetos de software livre e usar CVS pro desenvolvimento. Acho que realmente faz sentido, eu não tinha pensado nisso… Hehehe… Vou criar algo a respeito e depois eu publico aqui!

Se você for uma dessas pessoas dispostas, gostaria de pedir que você note alguns detalhes na construção dos meus arquivos:

  • Tabulação é feita com “tabs”.
  • As classes não imprimem nada na janela.
  • Mesmo os arquivos não imprimem nada também, eles imprimem para a variável $buf.
  • Não vale mexer nos arquivos config.php, index.php, ajax.php, scripts.js.php e style.css (por favor, deixe toda a parte de client-side, Ajax e configurações globais para mim :D ).
  • Todas as coisas que você passar para a variável $buf não podem conter texto. (Se você quer escrever qualquer coisa além do que foi retornado do banco de dados, deve criar uma variável $LANG[‘NOMEDAVAR’] no arquivo lang/pt_BR.php e lang/en_US.php
  • Se você não souber programar mas estiver afim de traduzir o projeto para alguma língua, me dê seu nome que quando tiver pronto eu vou querer muito sua ajuda.
  • Se você não quiser traduzir e nem souber programar, colabore com idéias de coisas que você acha legal o projeto ter (o que falta no Flickr que seria legal os programadores colocarem, ou sei lá…)

Espero que todos tenham entendido o espírito. Me mandem e-mail com sugestões e quem puder ajudar, ajude. Quem quiser dar um nome ao projeto, pode me sugerir também! Tenho certeza que um software livre desenvolvido pela comunidade para um fim que ainda não existe algo parecido (alguém conhece algum software livre de álbum de fotos que faça tudo que o Flickr faz?) fará bastante sucesso e será bem aceito ao menos pelos programadores (grande parte deles usa o Flickr mas tem um servidor legal que suporta PHP e GD).


Agora vamos voltar ao blog.

Fiquei um tempo sem postar justamente por causa desse projeto, que estou me esforçando para fazer o mais rápido possível. Também estou lendo “Java – Como Programar”. Tô gostando bastante da didática e gostando também da linguagem Java. No mais, não estou fazendo muita coisa. Estou indo trabalhar todos os dias a tarde, viajei final de semana para Florianópolis e agora que meu primo foi embora, minha casa está bem vazia (o que é ótimo! :) )

Mudanças no Site e Código do Blog

ATENÇÃO: Este conteúdo foi publicado há 11 anos. Eu talvez nem concorde mais com ele. Se é um post sobre tecnologia, talvez não faça mais sentido. Mantenho neste blog o que escrevo desde os 14 anos por motivos históricos. Leia levando isso em conta.

Ultimamente fiz várias alterações no site. Refiz quase que todas as páginas e deixei tudo um pouco mais leve e mais fácil para mudar depois. :D Depois de conhecer a POO, me viciei nela no final de semana e converti meu site inteiro para classes. E agora, que seu script tá um pouco melhor organizado, vou colocar aqui para quem quiser copiar, usar alguma idéia, saber como eu estou indo em POO, ver as besteiras que eu faço enquanto programo, etc. :lol: resolvi disponibilizar todo o código de meu blog aqui.

Já que meu blog tem alguns bugs (known bugs de pouca importância, como o caso de se alguém escreve CHARESPC no meio de um comentário ele deve criar um &;), peço somente que ninguém destrua-o sabendo disso. Se alguém descobrir algum bug, pode me enviar um e-mail que ficarei bastante grato. :)

Já que não passei a sessão de administração para POO não vou publicá-la aqui, mas depois de resolver alguns bugzinhos pretendo disponibilizar o código completo, inclusive com um arquivo de instalação que cria as tabelas no banco de dados, para todos poderem usar um sisteminha de blog simples e prático (só que acho que vai ser algo mais voltado a programadores, porque tem vantagens como o uso do GeSHi, e desvantagens como eu publicar todos os posts escrevendo em HTML – isso mesmo, até os & que eu escrevo são &amp; que são &amp;amp; *e um loop infinito pela frente). Hmmm, aliás, quem quiser me ajudar a fazer parte desse projeto para tornar o meu blog um software livre, sinta-se livre para me mandar um e-mail também. :p

Então, uma última observação é que eu substituí todos os <code (note a ausência do > ) por tag code e todos os </code> por tag /code, porque senão minhas expressões regulares do código dariam bug (quer saber por que? Então leia os códigos!)

Funções e classes “includadas” em todos os arquivos

<?php
session_start();
 
// Syntax Highlight - GeSHi
if (!class_exists(GeSHi)) {
	include("geshi.php");
}
 
// Objeto de conexão do MySql
class MySql {
	var $host="servidor";
	var $usuario="usuario";
	var $senha="senha";
	var $db="bancodedados";
	var $conexao;
 
	function conecta() {
		$this->conexao=mysql_connect($this->host, $this->usuario, $this->senha);
		mysql_select_db($this->db);
	}
 
	function desconecta() {
		mysql_close($this->conexao);
	}
}
 
// Classe com as funções de expressões regulares
class Regex {
	function Replace($o, $d, $t, $codes=0) {
		for ($i=0; $i<sizeof($o); $i++) {
			$o[$i]=str_replace('(', '(', $o[$i]);
			$o[$i]=str_replace(')', ')', $o[$i]); 
			$t=eregi_replace($o[$i], $d[$i], $t);
		}
		if ($codes==1) {
			$t="tag /code".$t."tag code";
		} else if ($codes==2) {
			$t.="tag code";
		} else if ($codes==3) {
			$t="tag /code".$t;
		}
		return $t;
	}
 
	function Emoticons() {
		$o[0]=":)";
		$d[0]="feliz";
		$o[1]=":(";
		$d[1]="triste";
		$o[2]=":o";
		$d[2]="bocaaberta";
		$o[3]=":p";
		$d[3]="lingua";
		$o[4]=":angry:";
		$d[4]="raiva";
		$o[5]=":s";
		$d[5]="confuso";
		$o[6]=":blink:";
		$d[6]="inacreditavel";
		$o[7]=";)";
		$d[7]="piscando";
		$o[8]=":lol:";
		$d[8]="rindo";
		$o[9]=":d";
		$d[9]="sorriso";
		$o[10]=":unsure:";
		$d[10]="semgraca";
 
		for ($i=0; $i<sizeof($d); $i++) {
			$d[$i]="<img src="/emoticon/".$d[$i].".gif" alt="".$o[$i]."" />";
		}
 
		if (!ereg("tag code", $texto)) {
			$this->texto=$this->Replace($o, $d, $this->texto);
		} else {
			preg_match_all("/</code>(.+)tag code/sU", $this->texto, $mat1);
			for ($i=0; $i<sizeof($mat1[1]); $i++) {
				$this->texto=str_replace($mat1[1][$i], $this->Replace($o, $d, $mat1[1][$i]), $this->texto);
			}
			preg_match("/^(.+)tag code/sU", $this->texto, $mat2);
			$texto=str_replace($mat2[1], $this->Replace($o, $d, $mat2[1]), $this->texto);
			$rev=strrev($this->texto); //Tenho medo do PHP5.0.5
			preg_match("/^(.+)>edoc/</sU", $rev, $mat3); //Nossa, que código louco!
			$rev=strrev($mat3[1]); //Repito... Tenho medo do PHP5.0.5
			$this->texto=str_replace($rev, $this->Replace($o, $d, $rev), $this->texto); //Agora fuck PHP5.0.5!
		}
	}
 
	function GeshiHighlight($codigo, $linguagem) {
		$geshi=new GeSHi($codigo, $linguagem, "./geshi/");
		return $geshi->parse_code();
	}
 
	function Codigos() {
		preg_match_all("/tag code class="(.*)">(.*)</code>/sU",
			$this->texto,
			$matches);
		for ($i=0; $i<sizeof($matches[1]); $i++) {
			$g=$this->GeshiHighlight($matches[2][$i], $matches[1][$i]);
			if (eregi("MSIE", $_SERVER["HTTP_USER_AGENT"])) {
				$g=ereg_replace("<pre>", "<pre class="alturamaxima">", $g);
			}
			$this->texto=str_replace($matches[0][$i],
				$g,
				$this->texto);
		}
	}
 
	function QuebraLinha() {
		$this->texto=nl2br($this->texto);
	}
}
 
// Objeto "Artigo"
class Artigo extends Regex {
	var $id;
	var $data;
	var $permalink;
	var $titulo;
	var $texto;
	var $comentarios;
 
	function Artigo($identificacao) {
		$this->id=$identificacao;
 
		$mysql=new MySql();
		$mysql->conecta();
 
		$query_post=mysql_query("SELECT data, permalink, titulo, texto FROM artigos WHERE id='{$this->id}'");
		$post=mysql_fetch_row($query_post);
		$this->data=date("d/m/Y", $post[0]);
		$this->permalink=$post[1];
		$this->titulo=$post[2];
		$this->texto=$post[3];
 
		$query_comentarios=mysql_query("SELECT count(id) FROM comentario WHERE idpost='{$this->id}'");
		$comentarios=mysql_fetch_row($query_comentarios);
		$this->comentarios=$comentarios[0];
 
		$mysql->desconecta();
	}
 
	function AppendGoogleAds($ads) {
		$this->texto.="nn".$ads;
	}
 
	function Mostra() {
		echo "<h2><a href="/post/{$this-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>permalink}">{$this->titulo}</a></h2>n";
		echo $this->texto."n";
		echo "<h5>{$this->data} ";
		echo "<a href="/post/{$this-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>permalink}" class="permalink">permalink</a> ";
		echo "<a href="/post/{$this-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>permalink}#comentarios" class="comentarios">";
		echo "{$this->comentarios} comentário(s)</a></h5>n";
	}
 
	function MostraComentarios() {
		if ($_POST["comenta"]&&(!$_SESSION["comentario"]||time()-30>$_SESSION["comentario"])) {
			$_SESSION["comentario"]=time();
			EscreveComentario($_POST["nome"], $_POST["email"], $_POST["texto"], $this->id);
		}
		$comentarios=new Comentarios($this->id);
		$comentarios->Mostra();
	}
}
 
// Objeto Artigos (serve para pegar vários artigos sem eu precisar fazer nada nas outras páginas)
class Artigos {
	var $id;
	var $titulo;
	var $texto;
	var $permalink;
	var $data;
	var $comentarios;
 
	function Artigos($n=20, $start=0, $emoticons=0, $codigos=0, $mostrar=0, $comentarios=0) {
		$mysql=new MySql();
		$mysql->conecta();
		$query=mysql_query("SELECT id FROM artigos ORDER BY data DESC, id DESC LIMIT $start,$n");
		$mysql->desconecta();
		for ($i=0; $array=mysql_fetch_array($query); $i++) {
			$artigo=new Artigo($array["id"]);
			if ($emoticons) {
				$artigo->Emoticons();
			}
			if ($codigos) {
				$artigo->Codigos();
			}
			if ($mostrar) {
				$artigo->Mostra();
			}
			if ($comentarios) {
				$artigo->MostraComentarios();
			}
			$this->id[$i]=$array["id"];
			$this->titulo[$i]=$artigo->titulo;
			$this->texto[$i]=$artigo->texto;
			$this->permalink[$i]=$artigo->permalink;
			$this->comentarios[$i]=$artigo->comentarios;
			$this->data[$i]=$artigo->data;
		}
	}
}
 
// Objeto Comentário
class Comentario extends Regex {
	var $id;
	var $data;
	var $nome;
	var $email;
	var $ip;
	var $useragent;
	var $texto;
	var $numero;
 
	function Comentario($identificacao, $numero) {
		$this->id=$identificacao;
		$this->numero=$numero;
 
		$mysql=new MySql();
		$mysql->conecta();
 
		$query=mysql_query("SELECT data, nome, email, ip, useragent, texto FROM comentario WHERE id='{$this->id}'");
		$comentario=mysql_fetch_row($query);
 
		$this->data=date("d/m/Y", $comentario[0]);
		$this->nome=$comentario[1];
		if ($_SESSION["tiagomadeira"]) {
			$this->email="</small><span style="font-size:10px;"><br />";
			if ($comentario[2]) $this->email.="<strong>E-mail:</strong> ".$comentario[2]."<br />n";
			if ($comentario[3]) $this->ip="<strong>IP:</strong> ".$comentario[3]."<br />n";
			if ($comentario[4]) $this->useragent="<strong>User Agent:</strong> ".$comentario[4];
			$this->useragent.="</span>";
		} else {
			$this->email="</small>";
		}
		$this->texto=$comentario[5];
 
		$mysql->desconecta();
	}
 
	function CharEspc($pos) {
		if ($pos==1) {
			$this->texto=preg_replace("/&([^;]+);/sU", "CHARESPC\1/CHARESPC", $this->texto);
		} else if ($pos==2) {
			$this->texto=preg_replace("/CHARESPC(.+)/CHARESPC/sU", "&\1;", $this->texto);
		}
	}
 
	function Mostra() {
		echo "<div class="comentario" id="com{$this->id}">n";
		echo "t<h4><a href="?PHPSESSID=9ec34c96b02b3755051aa682d1e02001#com{$this->id}">#{$this->numero}</a> | ";
		echo "{$this->nome} ";
		echo "<small>{$this->data}{$this->email}{$this->ip}{$this->useragent}</h4>n";
		echo "<p>{$this->texto}</p>";
		echo "</div>n";
	}
}
 
// Objeto Comentários
class Comentarios {
	var $idpost;
	var $ids;
	var $tamanho;
 
	function Comentarios($idpost) {
		$this->idpost=$idpost;
 
		$mysql=new MySql();
		$mysql->conecta();
 
		$query=mysql_query("SELECT id FROM comentario WHERE idpost='{$this->idpost}' ORDER BY data ASC, id ASC");
		for ($i=1; $array=mysql_fetch_array($query); $i++) {
			$this->ids[$i]=$array["id"];
		}
 
		$this->tamanho=$i;
		$mysql->desconecta();
	}
 
	function Mostra() {
		echo "<h3 id="comentarios">Comentários</h3>n";
		for ($i=1; $i<$this->tamanho; $i++) {
			$comentario=new Comentario($this->ids[$i], $i);
			$comentario->CharEspc(1);
			$comentario->Emoticons();
			$comentario->CharEspc(2);
			$comentario->QuebraLinha();
			$comentario->Mostra();
		}
 
		if ($this->tamanho <= 1) {
			echo "<p>Nenhum comentário cadastrado.</p>n";
		}
 
		FormularioComentario($this->idpost);
	}
}
 
// Função para descobrir IP do visitante
function PegaIP() {
	if (getenv("HTTP_CLIENT_IP") && strcasecmp(getenv("HTTP_CLIENT_IP"), "desconhecido")) {
		$ip=getenv("HTTP_CLIENT_IP");
	} else if (getenv("HTTP_X_FORWARDED_FOR") && strcasecmp(getenv("HTTP_X_FORWARDED_FOR"), "desconhecido")) {
		$ip=getenv("HTTP_X_FORWARDED_FOR");
	} else if (getenv("REMOTE_ADDR") && strcasecmp(getenv("REMOTE_ADDR"), "desconhecido")) {
		$ip=getenv("REMOTE_ADDR");
	} else if (isset($_SERVER['REMOTE_ADDR']) && $_SERVER['REMOTE_ADDR'] && strcasecmp($_SERVER['REMOTE_ADDR'], "desconhecido")) {
		$ip=$_SERVER['REMOTE_ADDR'];
	} else {
		$ip="desconhecido";
	}
 
	return($ip);
}
 
// Função que escreve o formulário para envio de comentário
function FormularioComentario($idpost) {
	$mysql=new MySql();
	$mysql->conecta();
	$query=mysql_query("SELECT permalink FROM artigos WHERE id='$idpost'");
	$row=mysql_fetch_row($query);
	$permalink=$row[0];
	$mysql->desconecta();
?>
 
<h3>Escreva um comentário</h3>
 
<form action="/post/<?=$permalink;?><input type="hidden" name="PHPSESSID" value="9ec34c96b02b3755051aa682d1e02001" />#comentarios" method="post">
	<ul>
		<li><label for="nome">Seu nome:</label>
			<input type="text" name="nome" id="nome" />
		</li>
		<li><label for="email">Seu e-mail<strong>*</strong>:</label>
 
			<input type="text" name="email" id="email" />
		</li>
		<li class="textarea"><label for="texto">Comentário:</label>
			<textarea name="texto" id="texto" cols="20" rows="15"></textarea>
		</li>
	</ul>
	<p><strong>*</strong> - Ele não aparecerá em público. Serve apenas para eu te contatar,
	caso queira responder seu comentário.</p>
 
	<p><input type="submit" name="comenta" value="Comentar" /></p>
</form>
<?php
}
 
// Função que cadastra um comentário
function EscreveComentario($nome, $email, $texto, $idpost) {
	$ip=PegaIP();
	$useragent=$_SERVER["HTTP_USER_AGENT"];
	$nome=purifica($nome);
	$email=purifica($email);
	$texto=purifica($texto);
	$data=time();
	$mysql=new MySql();
	$mysql->conecta();
	mysql_query("INSERT INTO comentario (id, idpost, nome, email, texto, data, ip, useragent) VALUES
		('', '$idpost', '$nome', '$email', '$texto', '$data', '$ip', '$useragent')") or die(mysql_error());
	$mysql->desconecta();
	$email=($email)?$email:"contato@tiagomadeira.net";
	$mensagem="No post de id $idpost, o $nome ($email) comentou em ".date("d/m/Y", $time)." dizendo:";
	$mensagem.="nn";
	$mensagem.="$texto";
	mail("contato@tiagomadeira.net", "[tiagomadeira.net] Novo Comentário!", "$mensagem", "From: $nome <$email>");
}
 
// Função que cria escreve o título das seções
function titulo($titulo) {
	$tit="$titulo [tiagomadeira.net]";
	echo "<script type="text/javascript">n";
	echo "ttop.document.title="$tit";n";
	echo "</script>n";
}
 
// Função para purificar os comentários depois do envio
function purifica($texto) {
	$t=ereg_replace("&", "&amp;", $texto);
	$t=ereg_replace("%", "&#37;", $t);
	$t=ereg_replace("<", "&lt;", $t);
	$t=ereg_replace(">", "&gt;", $t);
	$t=ereg_replace("[", "&#91;", $t);
	$t=ereg_replace("]", "&#93;", $t);
	$t=ereg_replace(""", "&quot;", $t);
	return $t;
}
 
// Função para editar artigos
function pra_textarea($texto) {
	$texto=ereg_replace("&", "&amp;", $texto);
	$texto=ereg_replace("<", "&lt;", $texto);
	$texto=ereg_replace(">", "&gt;", $texto);
	$texto=ereg_replace(""", "&quot;", $texto);
	return $texto;
}
 
?>

E os arquivos que usam essas funções e classes…

/artigos (ou /blog)

<?php
	$artigosporpagina=10; //Artigos Por Página
	$p=($_GET["pg"])?$_GET["pg"]:1; //Página Atual
 
	$mysql=new MySql();
	$mysql->conecta();
	$query=mysql_query("SELECT count(id) FROM artigos");
	$row=mysql_fetch_row($query);
	$np=ceil($row[0]/$artigosporpagina);
	$mysql->desconecta();
 
	$paginacao="";
	for ($i=1; $i<=$np; $i++) {
		$paginacao.="<a href="/artigos/$i"";
?PHPSESSID=9ec34c96b02b3755051aa682d1e02001
		if ($i==$p) $paginacao.=" style="font-weight:bold; color:#c00;"";
		$paginacao.=">$i</a> ";
	}
	$paginacao="nn<p style="text-align:center;"><span style="color:#aaa; font-size:11px;">Ir para página:</span> $paginacao</p>nn";

	echo $paginacao;
 
	$artigos=new Artigos($artigosporpagina, ($p-1)*$artigosporpagina);
	echo "<ul>n";
	for ($i=0; $i<count($artigos->id); $i++) {
		echo "<li><a href="/post/{$artigos-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>permalink[$i]}">{$artigos->titulo[$i]}</a><br />";
		echo "<small>{$artigos->data[$i]} ";
		echo "<a class="comentarios" href="/post/{$artigos-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>permalink[$i]}#comentarios">{$artigos->comentarios[$i]} comentário(s)</a>";
		if ($_SESSION["tiagomadeira"]) {
			echo " <a href="/admin-edita&amp;id={$artigos-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>id[$i]}">[editar]</a>";
			echo " <a href="/admin-exclui&amp;id={$artigos-?PHPSESSID=9ec34c96b02b3755051aa682d1e02001>id[$i]}">[excluir]</a>";
		}
		echo "</small></li>n";
	}
	echo "</ul>n";
 
	echo $paginacao;
?>

/ (ou /ultimos)

<?php
	$artigos=new Artigos(5, 0, 1, 1, 1);
?>

Para finalizar… .htaccess

RewriteEngine On
 
#Diretórios
RewriteRule ^link/?$ http://tableless.tiagomadeira.net
RewriteRule ^post/?$ http://tableless.tiagomadeira.net/blog
RewriteRule ^script/?$ http://tableless.tiagomadeira.net/scripts
RewriteRule ^downloadscript/?$ http://tableless.tiagomadeira.net/scripts
 
#Blog: A grande excessão
RewriteRule ^blog/([0-9]+)$ http://tableless.tiagomadeira.net/index.php?l=blog&pg=$1
RewriteRule ^/link/blog/([0-9]+)$ http://tableless.tiagomadeira.net/index.php?l=blog&pg=$1
RewriteRule ^artigos/([0-9]+)$ http://tableless.tiagomadeira.net/index.php?l=blog&pg=$1
RewriteRule ^/link/artigos/([0-9]+)$ http://tableless.tiagomadeira.net/index.php?l=blog&pg=$1
 
#Links
RewriteRule ^link/(.+)$ http://tableless.tiagomadeira.net/index.php?l=$1
RewriteRule ^([^/.]+)$ http://tableless.tiagomadeira.net/index.php?l=$1
 
#Posts
RewriteRule ^post/([0-9]+)$ http://tableless.tiagomadeira.net/index.php?l=artigo&id=$1
RewriteRule ^post/(.+)$ http://tableless.tiagomadeira.net/index.php?l=artigo&permalink=$1
 
#Scripts
RewriteRule ^script/(.+)$ http://tableless.tiagomadeira.net/index.php?l=script&script=$1
RewriteRule ^downloadscript/(.+)$ http://tableless.tiagomadeira.net/downloadscript.php?script=$1
 
#Feeds
RewriteRule ^feed.rss$ http://tableless.tiagomadeira.net/rss.php
RewriteRule ^rss.xml$ http://tableless.tiagomadeira.net/rss.php
RewriteRule ^index.rss$ http://tableless.tiagomadeira.net/rss.php
RewriteRule ^sitemap.xml$ http://tableless.tiagomadeira.net/sitemap.php

Novo site!

ATENÇÃO: Este conteúdo foi publicado há 12 anos. Eu talvez nem concorde mais com ele. Se é um post sobre tecnologia, talvez não faça mais sentido. Mantenho neste blog o que escrevo desde os 14 anos por motivos históricos. Leia levando isso em conta.

Deixei o site fora do ar por dois dias para acabar de fazer esse design. E não refiz só o design. Refiz os bancos de dados, textos (links), adicionei a seção Portifólio e reprogramei todo o site. Agora eu cadastro posts em HTML, fazendo com que eu possa abusar mais de formatação nos artigos. Posso postar várias imagens tipo as da minha biografia (aliás, enchi minha biografia de fotos). Também fiz bastante mudanças nas expressões regulares do site.

GeSHi

Estou usando o GeSHi para sintaxe colorida dos códigos que posto aqui. O “teste oficial” é o post Samba em Prelúdio que traz trechos dessa música, do Vinicius de Moraes e Baden Powell, escritos em várias linguagens, de várias formas diferentes, com sintaxe colorida do GeSHi.

Ainda não tá pronto!

Já publiquei tudo aqui como oficial, mas o site ainda não está completamente pronto. Ainda não fiz o feed (embora ele esteja declarado no cabeçalho da página), não acabei a seção Portifólio e nem o sistema de emoticons aqui dos posts e comentários. Eu tinha feito, mas o problema é que tava colocando emoticons nos códigos… Por isso, ainda tô tentando descobrir como eu faço para só o que tá fora dos code passar pela função de emoticons e espero que tudo se normalize em breve.

Eu também não copiei todos os posts antigos para cá, mas estou fazendo isso, pela ordem da visualização e comentários dos posts. Os posts mais linkados em outros locais já foram copiados, como a falha no Fotolog.net, posts sobre permutação, etc.

Avaliação

Postei o site em alguns fóruns para ser avaliado. Ele é totalmente baseado em CSS, então eu posso vir a alterar alguns detalhes. Agora ele tá bem mais semântico e bem escrito do que o antigo, o que facilita essas mudanças. Postem suas críticas e sugestões aí nos comentários! ;)

Espero que gostem!