Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Hello mates,
Então... fiz um planejamento que vai até o final do ano para atualizar o site da empresa que trabalho e torná-lo compatível com iPad e mídias sociais. O projeto ficou bacana e estou na fase de estudar o layout ideal.
Estou desenvolvendo a "cara" do site no Photoshop, e usando linhas guias para "visualizar" tabelas e divs, etc.
Sempre tive dificuldade pra me adaptar com o DW.... então faço tudo no editor de texto mesmo (uso o PSPad ou o notepad mesmo).
Estou montando agora um "boneco" em HTML e JS para estudar a viabilidade do layout, estética, usabilidade, etc, etc.
O resultado está mais ou menos assim.
Então comecei a imaginar a Administração para os canais e para o conteúdo dos canais.
E foi onde percebi o problema do layout que estou usando. Veja aqui um exemplo do conteúdo de canal.
O problema é que, ao inserir o conteúdo, não tenho como pré-determinar o número de caracteres... mas o espaço para cada content é limitado. Então eu preciso dividir o texto ao carregar a página, tipo uma páginação.
O processo seria mais ou menos assim:
1. Insere o conteúdo na página de administração
2. O conteúdo é armazenado no BD
3. A página carrega o conteúdo e, conforme o número de caracteres, divide o conteúdo em DIVs
Estou usando o Foundation Zurb (Orbit) e jQuery como frameworks. E ainda não iniciei a programação em PHP.
Mas como já percebi que essa será a grande questão, peço algumas ideias de como posso resolver isso.
Valeu galera!!!
Só para esclarecer como funciona o Orbit da Foundation.
A estrutura é essa:
<div id="featured">
<div class="content" style="">Conteúdo 1</div>
<img src="conteudo.jpg" />
</div>O jQuery é usado pelo framework da Foundation pra buscar o ID "featured" e fazer os slides.
As tags <img> são impressas na tela já como slides, sem necessidade de qualquer código acessório.
Mas quando o conteúdo a ser carregado é texto, é necessário colocálo numa <div> com a classe CSS "content".
Como tenho muitas partes dinâmicas, preciso de muito conteúdo nessas <divs>, mas eles tem que ser montados automaticamente.Para fins de curiosidade, testem no iPad, para ver como está ficando e qual a ideia. No monitor não dá para perceber direito ;)
Uma idéia seria você criar uma estrutura for, e ir dividindo o texto com a função substr, e as partes, você ir jogando em divs separadas. Ou então armazenar as partes em um array e depois com um foreach você inserir em divs diferentes usando jquery.
Valeu pastoremetal!
Vou tentar essas opções.
Qualquer coisa posto aqui novamente.
Muito obrigado!
Olá Juninho,
no site que eu to desenvolvendo eu tive que saber o número de caracteres pra implementar uma função, mas para outra funcionalidade....
Você pode fazer o seguinte:
primeiro veja o máximo de caracteres para cada div
Pegue o texto no banco de dados e salve em uma variável
pegue a quantidade de caracteres da variável: função strlen();
Através de um for você vai mandando exibir as divs e determinando o tamanho do texto com a função substr();
Exemplo de uso do strlen(): $tamanho_texto=strlen($texto);Exemplo substr():
$textodiv1 = substr($texto, 0, 300); // pega os 300 primeiros caracteres
$textodiv2 = substr($texto, 300, 600); //pega do caractere 300 ao 600
$textodiv2 = substr($texto, 600, 900); //pega do caractere 600 ao 900
<div id="featured">
<div class="content" style="">$textodiv1</div>
<img src="conteudo.jpg" />
</div>
<div id="featured">
<div class="content" style="">$textodiv2</div>
<img src="conteudo.jpg" />
</div>
<div id="featured">
<div class="content" style="">$textodiv3</div>
<img src="conteudo.jpg" />
</div>arruma um jeito de fazer exibir isso aí a partir de um While() q da tudo certo :)
obs. o código ta superficial, só para poder entender melhor :P
Valeu xará (Meu nome é João Paulo =)!
Então... gostei da ideia.
Vou aplicar aqui. Mas mentalmente já percebi uma questão importante heuheuhe
A questão dos <DIV> com o while é tranquilo, mas e a quebra do texto?
Será que é possível fazer com que o PHP identifique que aquilo é uma palavra
e não a corte no meio?
Tipo... nem fui atrás ainda. Tenho certeza que existe solução.
Foi só uma identificação mesmo =]
Vamos ao código aqui =D
Valeu John!
Então cara, aí é mais complicado, realmente vai ser um trabalho à parte que você terá que fazer. Mas em fim vou dar um pincelada aqui:
$texto; //variável que contém o texto inteiro
$limite_caracteres = 80; //quantidade de caracteres por div
$quant_divs = ceil(strlen($texto) / $limite_caracteres);
for($i=0; $i<=$quant_divs; $i++){
$inicio = $i*$total_caracteres;
$fim = $inicio+$total_caracteres;
for($x=0;$x<=strlen($texto);$x++){
if($texto[($fim+$x)] == " "){
$fim = $fim+$x;
}
}
$content .= "<div>".substr($texto,$inicio,$fim)."</div>";
}Não testei, e ainda tem que afinar para ficar direito, mas já é um começo.
pastoremental deu uma bela dica, porém faltou mandar sair do laço caso ache o espaço(' ');
fiz uma pequena modificação do for por um While
$texto; //variável que contém o texto inteiro
$limite_caracteres = 80; //quantidade de caracteres por div
$quant_divs = ceil(strlen($texto) / $limite_caracteres);
for($i=0; $i<=$quant_divs; $i++){
$inicio = $i*$total_caracteres;
$fim = $inicio+$total_caracteres;
$x=0;
$encontrado=false;
While($x<strlen($texto) and $encontrado==false){
if($texto[($fim+$x)] == " "){
$fim = $fim+$x;
$encontrado=true;
}
$x++;
}
$content .= "<div>".substr($texto,$inicio,$fim)."</div>";
}obs. Também não testei shaushauhee
Galera...
Só pra esclarecer... estou a procura de conceitos... não de códigos =D