quinta-feira, 13 de setembro de 2012
Usando CSS para criar efeitos avançados de texto
A propriedade text-shadow está por ai a algum tempo já e é usada para recriar efeitos de Drop Shadow comuns do photoshop, adicionando sombras, e ajudando a criar profundidade, dimensão e sobresair os elementos da página. Esses efeitos comuns não são todas as propriedades que a propriedade Text-Shadow é capaz, sendo criativo e brincando um pouco com as cores, offset e blur nós podemos criar alguns efeitos bem bonitos e interessantes.
Saquem só esses seis efeitos de vintage/retro, inset, anaglyphic, fogo e board game nesse demo, então copie os códigos abaixo para criar esses efeitos em seus projetos. É necessário citar que você precisa de um browser moderno (Safari, Chrome, Firefox) para ver os efeitos em sua total gloria.
Veja a demo
CSS - DIV com cantos arredondados com Sombreamento de Fundo e cor em Degradê
Segue um exemplo de como fazer uma DIV com cantos arredondados, sombreamento de fundo com cor em degradê
Entre as tags <header> </header> coloque código do CSS.
<style type="text/css">
.box {
/*Degrade*/
background: -moz-linear-gradient(#CC0000, #990000) no-repeat scroll 0 0 transparent;
/*cantos arredondados*/
border-radius: 5px 5px 5px 5px;
/*Sobreamente*/
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
width:15%;
margin:0 0 0 0px;
}
</style>
Entre as tags <body> </body> coloque a DIV.
<div class="box" style="height:300px; margin-top:50px; margin-left:50px;" >CSS - DIV com cantos arredondados e Sombreamento de Fundo e cor em Degradê</div>
Entre as tags <header> </header> coloque código do CSS.
<style type="text/css">
.box {
/*Degrade*/
background: -moz-linear-gradient(#CC0000, #990000) no-repeat scroll 0 0 transparent;
/*cantos arredondados*/
border-radius: 5px 5px 5px 5px;
/*Sobreamente*/
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
width:15%;
margin:0 0 0 0px;
}
</style>
Entre as tags <body> </body> coloque a DIV.
<div class="box" style="height:300px; margin-top:50px; margin-left:50px;" >CSS - DIV com cantos arredondados e Sombreamento de Fundo e cor em Degradê</div>
terça-feira, 11 de setembro de 2012
Detectando a resolução da tela com Javascript
O código abaixo detecta a resolução da tela (largura x altura) do usuário e emite uma mensagem com a resolução detectada.
Dentro das tags <head> .. </head> coloque o código abaixo:
<script type="text/javascript">
//pega a largura da resolução da tela
var width = screen.width;
//pega a altura da resolução da tela
var height = screen.height;
//mostra um alerta com a resolução da sua tela.
alert("A resolução da tela do seu monitor é " + width + "x" + height + ".");
</script>
Dentro das tags <head> .. </head> coloque o código abaixo:
<script type="text/javascript">
//pega a largura da resolução da tela
var width = screen.width;
//pega a altura da resolução da tela
var height = screen.height;
//mostra um alerta com a resolução da sua tela.
alert("A resolução da tela do seu monitor é " + width + "x" + height + ".");
</script>
GOOGLE FONTS DIRECTORY, SAIA DO PADRÃO!
Você que sempre quiz usar uma fonte diferente no seu site, sair de vez do padrão, Arial, Times, Tahoma…ficará muito feliz com essa noticia, o Google Font Directory permite que você utilize todas as fontes disponíveis através da API do Google Font. Todas as fontes no diretório estão disponíveis para uso em seu site sob uma licença open source e são fornecidos por servidores da Google. para usá-las basta fazer o seguinte, siga até o Google Fonts Directory, selecione umas das 20 fontes disponiveis, clique em Get the code, feito isso aparecerá as opções de vinculação de código, por exemplo:
Este link você cola dentro das tags: <head></head>
Depois copie o código para o arquivo CSS, e cole onde achar necessário:
Funciona no IE6 também (\O/), por enquanto tem um numero limitado de fontes, mas logo, logo, terá a possibilidade de enviar fontes para utilização , lembrando que com o CSS3 já é possivel fazer isso com a propriedade @font-face.
Este link você cola dentro das tags: <head></head>
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans+Std+Light' rel='stylesheet' type='text/css'>
Depois copie o código para o arquivo CSS, e cole onde achar necessário:
font-family: 'Josefin Sans Std Light', arial, serif;Veja um exemplo neste link
Funciona no IE6 também (\O/), por enquanto tem um numero limitado de fontes, mas logo, logo, terá a possibilidade de enviar fontes para utilização , lembrando que com o CSS3 já é possivel fazer isso com a propriedade @font-face.
Templates para CMS Joomla
Se você é desenvolvedor, é melhor que tente entender como
funciona o Joomla e tente criar o próprio template, pois quando usamos
um template pronto sempre vem com muitos códigos e arquivos que
provavelmente em seu projeto mesmo personalizando interferirão no
desempenho do seu site. Um código todo desenvolvido por você ficará mais
leve e só carregará o que realmente necessita, otimizando o desempenho
do seu site.
Veja este artigo de como criar templates para Joomla : Como fazer template em Joomla?
Empresas que desenvolvem templates realmente profissionais com preço acessível.
Veja este artigo de como criar templates para Joomla : Como fazer template em Joomla?
Empresas que desenvolvem templates realmente profissionais com preço acessível.
- Gavick - www.gavick.com
- Joomlart - www.joomlart.com
- Rocket Theme - www.rockettheme.com
- JT Joomla Templates - www.joomlaplates.com
- Theme Forest - www.themeforest.net
- Flash Mint - www.flashmint.com
TEMPLATES JOOMLA GRÁTIS
- Site Ground – O site tem 49 templates grátis.
- Joomla Shack – Oferece 14 templates grátis para o Joomla.
- Joomla Templates – Oferece 12 Templates gratuitos para o Joomla.
- Joomla 24 – Segundo o site, eles possuem mais de 1500 templates gratuitos para o Joomla.
- Joomla Designs – Oferece 11 templates gratuitos.
- Joomla TP – Oferece centenas de templates gratuitos.
- Themza – Oferece 8 templates grátis.
- Joomlart – Oferece 58 templates grátis.
- Best of Joomla – Oferece centenas de templates gratuitos.
- Themes Base – Oferece centenas de templates gratuitos.
- Joomla 2 U – Oferece mais de 500 templates gratuitos.
quarta-feira, 5 de setembro de 2012
Objeto Database do Joomla 1.5
O objeto database do Joomla 1.5 possui alguns métodos
que facilitam a vida dos programadores de extensões (componentes,
módulos e plugins).
De posse do $db podemos fazer uma porção de estripulias.
Mas, se quisermos um array de objetos com todos os artigos da tabela, devemos fazer o seguinte:
Pois bem, e se eu quiser apenas que uma query atualize algum campo de alguma tabela da base de dados? Aí é mais fácil:
O método getNullDate fornece uma "data e hora" zerada, ou seja, 000-00-00 00:00:00
fonte : http://www.numaboa.com.br/informatica/tutos/joomla/957-objeto-database
O básico
Bem, o básico do objeto Database é o seguinte: quando o Joomla 1.5 é iniciado, ele precisa fazer uma série de consultas à sua base de dados, senão nem consegue "entrar no ar". Para fazer estas consultas, o sistema cria um objeto database. Se este objeto já existe, não há a necessidade de criar um objeto do mesmo tipo para suprir nossas necessidades - basta chamá-lo por referência. Para invocar qualquer objeto por referência usa-se o marcador &. No caso, para obter este objeto, o código é o seguinte:$db =& JFactory::getDBO();
Curtinho e prático, e nosso objeto de desejo está incorporado a $db De posse do $db podemos fazer uma porção de estripulias.
Colhendo os frutos
Com o objeto Database à disposição podemos fazer uma query (pergunta) ao banco de dados e depois colher as respostas. Para colocar uma pergunta chama-se (com ->) o método setQuery() através deste objeto. Por exemplo:$db->setQuery('SELECT * FROM #__content');
Depois da query colocada, podemos consultar vários resultados.
Por exemplo, se quisermos apenas o valor do primeiro campo da primeira
linha do conjunto de resultados, é só usar o método loadResult:$db =& JFactory::getDBO(); $db->setQuery('SELECT * FROM #__content'); $pergunta = $db->loadResult();
Se quisermos todos os campos da primeira linha do conjunto de resultados, então é preciso chamar:$pergunta = $db->loadResultArray();
que coloca os resultados encontrados num array. Se preferir um objeto
cujas propriedades sejam os nomes dos campos, você pode executar a
query com:$objeto = null; $db->loadObject( $objeto );
Agora $objeto->title é o título do primeiro artigo achado,
$objeto->alias é o apelido do artigo e assim por diante. Quando o
objeto for null, este método cria o objeto e lhe atribui as
propriedades com os valores da primeira linha encontrada.Mas, se quisermos um array de objetos com todos os artigos da tabela, devemos fazer o seguinte:
$db =& JFactory::getDBO(); $db->setQuery('SELECT * FROM #__content'); $pergunta = $db->loadObjectList(); foreach( $pergunta as $artigo) { echo "$artigo->title: $artigo->alias" }
Este trecho de código vai listar todos os títulos e todos os alias dos artigos existentes na tabela de artigos.Pois bem, e se eu quiser apenas que uma query atualize algum campo de alguma tabela da base de dados? Aí é mais fácil:
$db =& JFactory::getDBO(); $query = "UPDATE TABLE #__content SET title='Novo título' WHERE id=1"; $db->setQuery( $query ); $db->query();
Observe que a query foi colocada numa variável, a $query. Depois, esta variável foi usada como parâmetro em setQuery(). Isto não é obrigatório, mas deixa o código um pouco mais claro. Uma vez colocada a query, ela pode (e deve) ser acionada pelo método query(). Aí está tudo em riba Mais algumas mordomias
Além de buscar resultados de pesquisas, também podemos usar o objeto database para fornecer alguns valores extras. Por exemplo:$db->getEscaped( "pingo d'água" );
prepara strings com caracteres especiais (como é o caso do apóstrofo)
para que sejam aceitas pelo banco de dados sem darem erro. O método
acima transforma "pingo d'água" em "pingo d\'água".O método getNullDate fornece uma "data e hora" zerada, ou seja, 000-00-00 00:00:00
$db->getNullDate();
Se quisermos saber quantas linhas foram produzidas pela última query que foi acionada, o método é:$db->getNumRows()
Para fazer tratamento de erros podemos usar o seguinte:if( $db->getErrorNum() ) { echo $db->getErrorMsg(); }
fonte : http://www.numaboa.com.br/informatica/tutos/joomla/957-objeto-database
segunda-feira, 3 de setembro de 2012
Como utilizar sessões (session) em Joomla! 1.5 usando o API do Joomla ?
- Isto pode ser obtido utilizando o objeto JFactory / getSession
- Instanciar o objeto getSession
$session =& JFactory::getSession();
- Aqui estão alguns parâmetros que você pode usar. eles são:
- name - O nome da sessão
- id - Um ID unico da sessão
- expire - Data de validade e tempo
- security - opções separados por vírgulas
- Agora vamos definir a sessão
- Pegar o valor da variável de sessão da seguinte forma
Assinar:
Postagens (Atom)