Posts com a tag 'PHP e CSS "
Parte 4
da série sobre os ins e widgets sobre este blog
Em última análise, isso não é uma parte integral da série, mas um complemento.
Na quarta Parte do que eram tratados Tweet Este , por si só um plugin legal para o Twitter, mas também serviços de bookmarking social (Plurk, Buzz, Delicious, Digg, Ping, Reddit, Tropeço). Várias opções de configuração e uma selecção de botões de fantasia arredondado a primeira impressão positiva. Infelizmente, a mensagem de erro
Aviso: Argumento inválido fornecido para foreach () 358 em home/web160/klem08/ftproot/www.klemmchen.de/wp/wp-content/plugins/tweet-this/tweet-this.php / on-line
A resposta a pedidos não se concretizou, então eu fiz o que outros fizeram: Eu desativado o plugin. Agora, uma alternativa foi necessária.
Este Twit : Cuida de nós mesmos só cantar exclusivamente para o. Existe um plugin, mas o código inserido manualmente:
<!-- Begin TwitThis (http://twitthis.com/) -->
<script type="text/javascript" src="http://s3.chuug.com/chuug.twitthis.scripts/twitthis.js"></script>
<script type="text/javascript">
<!--
document.write('<a href="javascript:;" onclick="TwitThis.pop();"><img src="http://s3.chuug.com/chuug.twitthis.resources/twitthis_grey_72x22.gif" alt="TwitThis" style="border:none;" /></a>');
//-->
</script>
<!-- /End -->
Optei pela versão do código, porque permite fazer ajustes no projeto, sem ter que ligar herumpulen. Assim eu poderia substituir. Arquivo GIF com um arquivo PNG auto-criado., E também no controle de onde o loop é para aparecer, o botão é dada desta maneira.
Mais Buscados em del.icio.us : Porque eu queria também ter um botão delicioso teve a seu outro plugin. É um pouco datado, mas mesmo em princípio XHTML válido. Por este meio
<?php dbt_the_LinkTag("Bookmark on del.icio.us"); ?>
O visor pode ser feita dos botões dentro do loop, e eu poderia colocar um botão ao lado no Twitter. Eu adicionei links de texto em vez de uma imagem, mas eu também poderia ter sido mais fácil. (Recomendamos que você leia os arquivos Leia-me de vez em quando.
) Existem inúmeras dicas sobre como você pode mudar o display e posicionamento. Com este código
<?php dbt_the_LinkTag("<img src='http://www.klemmchen.de/wp/wp-content/themes/environment/images/tt-delicious-micro4.png' alt='add to delicious' />","delicious"); ?>
é inserida sob a pós uma imagem, que também é novamente livremente seleccionável. No entanto, se os amantes XHTML propostas no arquivo readme para pelo menos um trecho de código alt="" Adicionar tag, caso contrário, o validador não concordou.
Ambas as soluções funcionam bem! No entanto, gostaria de referir: O Tweet Esta variante seria mais fácil se eles iriam sobreviver, porque sem erros.
Hechelbach não pode deixar - ele foi um pouco parafusado no projeto. Em resumo, se você sobrevoar o endereço de raiz, há agora "apenas" extratos ( <?php the_excerpt(); ?> ) - como de costume, um clique traz o título do artigo em vista única, mas também uma link abaixo o trecho ("ler esta entrada» '), transporta o leitor não diretamente. A mesma opinião foi selecionado para o arquivo.
Se você gosta dele, é oferecido como um download. Estamos, no entanto, depende de feedback. Como você gosta desse tipo de tela e navegação?
Aqui está o código curto (atualmente em search.php archive.php e index.php):
<div class="entry">
<?php the_excerpt(); ?> <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', 'kubrick'), the_title_attribute('echo=0')); ?>"><?php printf(__('Read the rest of this entry »', 'kubrick')); ?></a>
</div>
É você pode ter notado aqui e ali: Não só é o título do blog é clicável, mas também a descrição. Você também pode chamar esta área de legendas. Você tem um visitante isso não é real funcionalidade adicional - você só de lá ir para casa do que você clique no título do blog. O blogueiro, pelo menos quando ele é registrado, mas de lá diretamente para a área administrativa. Talvez este artifício é interessante para você - para chegar ao painel, você não deve, então, shimmy à ligação Admin, como a descrição do blog é realmente o topo do cabeçalho da página e é, portanto, sempre de fácil acesso. Nós estávamos aqui há muito tempo, suave para o blog título e descrição do novo design tinha, para a visualização de que nós abolimos o título e descrição.
O bom é que esta pode ser conseguida com muito pouco código. O lugar onde isso está acontecendo, os header.php. Basta procurar <?php bloginfo('name'); ?> e <?php bloginfo('description');?> . A seção que se parece muito parecido com este:
<!-- No.1: USUAL WAY. CLICK ON BLOG TITLE LETS YOU RETURN HOME WHILE THE DESCRIPTION IS JUST A DESCRIPTION NOT A CLICKABLE AREA. -->
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description"><?php bloginfo('description'); ?></div>
</div>
</div>
<!-- END of No.1 -->
basta substituir este por:
<!-- No.2: THE FOLLOWING COMMENTED PART IMPLEMENTS DIRECT ACCESS TO ADMININSTRATION BY CLICKING ON THE BLOG DESCRIPTION WHILE ANYONE WHO IS NOT LOGGED IN RETURNS BACK HOME -->
<div id="header">
<div id="headerimg">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<div class="description">
<a href="<?php
if (current_user_can('level_10'))
echo get_settings('home').'/wp-admin/">';
else
echo get_settings('home').'/">';
bloginfo('description'); ?>
</a>
</div>
</div>
</div>
<!-- END of No.2 -->
Qual é o código? Enquanto clicável na opção 1, o padrão de cabeçalho título do blog, e descrição são exibidos no cabeçalho, mas apenas o título e o usuário de volta para casa traz ( <a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a>) , está na versão 2, que também mostra tanto entrevistados, clicando na descrição de permissão do usuário. current_user_can('level_10') é a autoridade máxima, ou seja, os administradores. Que fica em frente do computador está conectado, olhar para seu próprio blog e gostaria de ir com urgência para o painel, então tudo que ele precisa (ou ela, é claro) clicando na descrição para este blog. Os usuários que não são registrados e, portanto, não tem as permissões apropriadas, em vez de simplesmente sorriu para casa.
Teoricamente (e praticamente) o pedido de autorização para outras funções faz sentido que apenas o administrador deve estar disponível. A gama de privilégios que variam de 0 (utilizador registado) através de 1 (os empregados), 2 (o autor do blog) e 7 (o editor) para dar 10 (o administrador). Claro, os bits de permissão são compatíveis: Um administrador pode fazer tudo (níveis de 10 a 0), porque a editora já está comprometida (Nível 7-0), etc
Frequentemente, mas nem sempre, objetos pessoais, um sucesso tendo em vista os fatos e as respostas é concedido. Pode-se manter alguns itens especialmente, mas nem todos os visitantes têm tempo ou inclinação para peneirar tudo, só para descobrir neste artigo. Mas a solução é simples: Ele vai apagar todas as mensagens, exceto aqueles que devem ser lidas de acordo com seu próprio entendimento dos usuários. Obrigado por sua atenção! Até a próxima!
Bem, você está certo de que não pode ser a solução! Vai ser diferente. E, sim, há uma possibilidade. A inspiração para o que eu sou auto-didata em algum lugar na rede. (Vou postar assim que eu encontrá-los novamente.)
Se você escreve um artigo, clique abaixo "campo especial". Lá você adicionar algo a seu gosto, temos "favarticle" é selecionado, você também pode Che Guevara ou o Mickey Mouse ou uma frase de sua escolha para adicionar. O importante é que você é uma ou outra palavra ou um sublinhado ( _ ) Selecione uma conexão entre várias palavras. Então você atribui outro valor, neste caso temos um número 1 ou 2 é utilizado - os candidatos listados 1-será antes dos 2-candidatos. Estende-se também a atribuir apenas um número.
Agora você precisa adicionar algum código. Primeiro deve ser executado para o functions.php código base um local adequado. Claro que você também pode inseri-lo diretamente no arquivo php onde você precisar dele. Também recomendado é uma troca, pois este preserva a clareza, e você são determinados vários pontos em seu tema onde você pode inserir uma lista de seus favoritos. Aqui está o código que empurraram para o functions.php:
<?php function getFavArticles($count){ global $wpdb; $count = intval($count); $favarticles = $wpdb->get_results("SELECT post_id FROM $wpdb->postmeta WHERE meta_key ='favarticle' ORDER BY meta_value ASC LIMIT 0, $count"); if ($favarticles){ foreach ($favarticles as $favarticle){ $title = wptexturize(get_the_title($favarticle->post_id)); $link = get_permalink($favarticle->post_id); echo '<li><a href="'.$link.'" title="'.$title.'">'.$title.'</a></li>'; } }else{ echo '<li>...</li>'; } } ?>
Qual é o código? Ele chama uma função getFavArticles em que você pode se referir a algum lugar mais tarde em seu tema. Ele está procurando um meta_key ='favarticle' , então a chave. Você tem que definir, e classificados de acordo com o item selecionado para o valor atribuído de acordo com a ordem crescente. Abaixo estão os títulos dos artigos como links clicáveis.
Então, agora você preparou artigos, a função PHP - você ainda precisa de um lugar para executar a função ea lista de seus tesouros serão exibidos. Nós colocamos a lista de favoritos na barra lateral padrão, que é, no entanto, o uso de widgets configurar o conteúdo a partir do zero. Então, ferrou-los (a lista, não é, os leitores), também em single.php. A visão única é formada no mesmo sem a barra lateral, mas com uma representação que utiliza o espaço disponível melhor . Temos uma uma cor extra do resto do site claramente escorregou caixa com os pontos principais de navegação instalados, não há atualmente também a lista de favoritos. Obter o código para a barra lateral (que é ligeiramente diferente do que a visão de produto estruturado):
<?php }?> <?php if (function_exists('getFavArticles')): ?> <li><h3><?php _e('Top posts', 'kubrick'); ?></h3> <ul> <?php getFavArticles(10); ?> </ul> <?php endif; ?> </li>
e adaptado para a caixa de código:
<?php if (function_exists('getFavArticles')): ?>
<h2><?php _e('Top posts', 'kubrick'); ?></h2>
<ul><li>
<?php getFavArticles(10); ?>
</li></ul>
<?php endif; ?>
Devido às instruções lista convertida ( <ul> como uma introdução de uma lista (ul = lista desordenada list = desordenada), <li> como um novo item da lista dentro dessa lista (li = item da lista lista =) pelas tags de terminação </li> e </ul> ) e as diferentes rubricas ( <h3> ou <h2> ) é a representação da lista de favoritos, algo diferente, mas adaptada à situação particular e ao mesmo conteúdo.
Determinado você pode pensar em outras aplicações! Finalmente, você pode fazer o seu artigo sobre selos, nas compras de roupas ou sua esposa - oh, o que eu sei! - Com este tipo de listas que você definir campos especiais, especificamente em algum lugar vendendo.
Boa luz e Nuck bom!
Você provavelmente conhece o "padrão do WordPress" Tema, também conhecido como "Kubrick". Este tema é geralmente baseada em nosso "ambiente" é o tema, embora tenha sido modificado de forma que não é imediatamente perceptível. Muitos consideram "Kubrick", a ser ultrapassada, porque você já viu isso muitas vezes. Em princípio, isso pode ser verdade, se ele envia para a corrida completamente inédito. Mas decidimos por causa dos pontos fortes dos temas para o uso, defina o tema novamente e agora usá-lo neste blog.
A barra lateral, para a barra lateral com links, palavras-chave e categorias, para muitos usuários uma visão familiar, e muitas vezes ele vem com plug-ins adicionais jazzed, usamos, por exemplo, incluindo o widget emblema Flickr para apresentar suas próprias fotos no Flickr. "Kubrick" shows em seu estado original, mas não em todas as situações, uma barra lateral. Muitos sentem que este é um problema. Como mudar as arquibancadas aqui . Inicialmente, tínhamos também mudou para todos os tipos de pontos de vista, mas, pelo menos, uma visão única de produtos barra lateral 0hne tem um potencial inexplorado. Pode-se aumento na realidade, mais algumas pequenas alterações na folha de estilo (style.css) é simplesmente a área de exibição da vista único artigo e uso como o espaço da barra lateral faltando útil.
Nós estamos olhando para a entrada seguinte na style.css
.widecolumn { padding: 10px 0 20px 0; margin: 5px 0 0 150px; width: 450px; }
e alterá-lo da seguinte forma:
.widecolumn { padding: 10px 0 20px 0; margin: 5px 0 0 70px; width: 600px; }
Pelo margin valor de 150px para 70px foi baixada, move-se na extremidade esquerda do artigo para a esquerda, existe a fronteira livre não utilizado no original agora utilizado para a exibição da contribuição. O Width -valor foi agora de 450px para 600px aumentou, assim, o item aparecerá maior e, portanto, utiliza o espaço de outra forma lateral ocupada. Especialmente para longos artigos pode ser vantajoso porque o utilizador se move para não tão frequentemente, a fim de alcançar a extremidade do artigo.
Uma desvantagem deste método é que o usuário tem que rolar novamente para retornar à página inicial e, portanto, a barra lateral novamente à nossa disposição. A desvantagem, temos uma caixa fixada no produto final, no - visualmente consciente de outro monitor levantado - encontrar os links de navegação principal. Esta caixa é também usado para outros fins, mas mais em um artigo posterior.
Digamos que você queira permitir que seus visitantes para uma página de comentários experiência de layout personalizado. Standard, essas caixas incolores com letras pretas em nome dos seus visitantes (obrigatório) "," E-mail (não será publicado) (obrigatório) "e" Web Site "e digite o texto do comentário. Desde que você agora deseja adicionar um pouco de cor ou até mesmo uma foto? Não tem problema, isso é feito em alguns momentos.
Primeiro, você só precisa de uma idéia de como isso deve ser parecida. Gostaria de uma cor ou uma imagem? Então você abre o painel do Wordpress style.css e procurar por frases como estas:
#commentform input ou #commentform textarea . (A especial no seu caso também pode contribuir nomes ligeiramente diferentes, mas se você ver o mesmo código, mas você tem uma idéia do que deve ser encontrada no local apropriado.
#commentform input {
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
background: url('images/kubrickbgcolor.jpg');
color: #ffffcc;
}
"Largura" determina o comprimento do campo de entrada, "estofo" o preenchimento do conteúdo até a borda e "margem" a uma distância transparente para o próximo item. Cheio enquanto "enchimento" com a cor ou a imagem de sua escolha é, é a "margem" é realmente transparente, e olha só como sua página, onde você apresenta seu conteúdo. (As referências CSS pode ser encontrado aqui e aqui ).
No caso do nosso lado, nós queríamos ter o fundo como nos campos de entrada. Consequentemente, nós adicionamos o caminho para este mesmo arquivo de imagem: background: url('images/kubrickbgcolor.jpg');
Uma vez que este é bastante escuro, temos com color: #ffffcc; a cor do texto correspondeu a um interior luminoso. Afinal, os visitantes podem ler o que escrevem.
Você prefere uma cor em vez de uma imagem? Não substitua questão, apenas o background: url seção com esta: background: #000000; . O exemplo é codificado preto, mas você também pode entrar em qualquer outra cor.
Da mesma forma, complementar a gama #commentform textarea da mesma maneira.
Os resultados você pode ver abaixo neste artigo, por exemplo, se você ler isso em vista única.
Boa luz e Nuck bom!
Vocês todos sabem o padrão usual de um blog: No topo da página aparece o nome do blog <?php bloginfo('name') ?> ea descrição <?php bloginfo('description'); ?>. Clique no nome do blog traz a os usuários de volta para o diretório principal. Mas se você quiser - como artifício - apenas especificar que tipo de letra a que aparece na imagem do cabeçalho, é difícil por si só, simplesmente porque font recém-criado, não está apenas instalado em qualquer computador - e pode ser usado só para eles. Em novo romance Arial ou Times não é certamente um problema, mas você sabe, por exemplo, ou até mesmo Haettenschweiler grampos pequenos? Veja - o requisito de design estão sujeitos a severas restrições. Com algumas poucas trechos de código, mas isso não é problema.
<h1><a xhref="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a></h1> <div class="description"><?php bloginfo('description'); ?></div>
Encontre esta passagem nos header.php. Excluí-los ou comentá-las. Comentando fora? Tudo entre <!-- e --> está envolvido, é passado ao longo, e é, portanto, inexistente para o software que traduz a rabiscar em um lado da linha visível. Nós sempre comentar muito, pelo menos, se não for renovado o uso dos códigos utilizados agora não é impossível - para posteriores alterações no código, você tem de digitação para menos. Em qualquer caso, a passagem acima é agora fora da corrida. Wordpress Alemanha oferece agora duas maneiras . Ambos funcionam perfeitamente, mas cada um associado a certas limitações. Quando a cabeça está codificado, inserir um
<div id="header" onclick="location.href='<?php bloginfo('url') ?>';" style="cursor: pointer;">...</div>
uma. A desvantagem é que os motores de busca têm dificuldade em ler tal passagem escrita - você pode ver o seu blog, carregado sobre a forma mais amorosa, com artigos e fotos maravilhosas, não são encontrados. (E isso seria desagradável.) Deve também inclinado leitor em seu navegador para ativar o JavaScript, o onclick passagem indica. Por sua vez JavaScript muitos, mas por razões de segurança (em curto: JS), porque JS também podem ser fornecidas com um código de defeito. Se a sua cabeça Cascading Style Sheets Imagem via: ter incluído (abreviado CSS), então é melhor você tomar este código.
<div id="header"> <a href="<?php bloginfo('url') ?>/" style="display:block; width:100%; height:100%;"> <span style="visibility:hidden"><?php bloginfo('name') ?></span> </a> </div>
O funciona de forma confiável, e seu site está em conformidade com XHTML validação continua. Esta não é uma plataforma para a apresentação cruzada de seu blog sem importância. (Não que este blog é o Validieruung cumprida, pela forma como o Flickr plug-in.) Como você pode reconhecer se a sua imagem de cabeçalho com CSS está envolvido? Bem, você correm em seus tempos stylesheet.css e procure por uma passagem que se assemelha a este:
#header { background: #352726 url('images/kubrickheader.jpg') no-repeat bottom center; } #headerimg { margin: 7px 9px 0; height: 192px; width: 740px; }
Aqui é a cor de fundo que é exibida quando nenhuma imagem aparece, especifique o caminho para o arquivo de imagem (geralmente, mas nem sempre as imagens \) e as dimensões gerais (as dimensões) da imagem. Então, agora você sabe que
Boa luz e Nuck bom!
Hechelfeld















