Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Alice Marie

Carregar novas postagens sem refresh e que substitua as postagens existentes (Blogger)

Recommended Posts

Eu estou desenvolvendo um site e estou atrás de um recurso que me permita adicionar novas postagens a página inicial, mas que substitua as que já estão lá (Ex: Eu exibo quatro postagens na página inicial, ai que tem um botão que me permita carregar mais quatro e que essas quatro postagens "nova" entrem no lugar das quatro que estavam lá inicialmente e assim sucessivamente. ~Não é pra adicionar junto com as que já estavam e pra substituir.~).  Não sei se é possível, mas...

 

 

Alguns detalhes importantes:

  • Eu realmente não sei se tem alguma diferença, mas eu uso a hospedagem do blogger;
  • Outro detalhe importante e que eu sou totalmente leiga no assunto (estou criando meu site na curiosidade mesmo) então se poderem me explicar de forma que um completa leiga entenderia (sem usar muitos termos técnicos).

Compartilhar este post


Link para o post
Compartilhar em outros sites
57 minutos atrás, Alice Marie disse:

uso a hospedagem do blogger

Se você realmente APENAS tem a hospedagem, mas tem acesso total aos seus arquivos tanto front (html, css, javascript) quanto backend(php) não tem problema nenhum, caso contrário, aí já fica mais complicado, não sei como funciona as ferramentas do blogger.

 

O que você precisa é uma paginação com ajax, de uma pesquisada por este termo no google, tem bastante conteúdo a respeito.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá Alice, acredito que na hospedagem do Blogger eles permitam somente o próprio Blogger, não? Por exemplo, como o Wordpress.

 

 

O que você precisa é substituir o conteúdo de uma DIV, por exemplo, através de jQuery, Angular ou algum outro framework, chamando esses destaques que irão substituir através de Ajax.

 

Se estiver interessada em aprender como fazer (não só PARA fazer), recomendo este curso aqui. As primeiras aulas dele ensinam basicamente o que você precisa saber: https://www.youtube.com/watch?v=_y7rKxqPoyg&list=PLQCmSnNFVYnTD5p2fR4EXmtlR6jQJMbPb&index=1

 

Aqui tem um exemplo bem simples usando jQuery, porém no seu caso creio que deverá buscar o conteúdo novo vindo de uma fonte externa, em Ajax: https://jsfiddle.net/th4d/ovaggr6w/

 

Abs.,

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
7 horas atrás, Mateus Silva disse:

Se você realmente APENAS tem a hospedagem, mas tem acesso total aos seus arquivos tanto front (html, css, javascript) quanto backend(php) não tem problema nenhum, caso contrário, aí já fica mais complicado, não sei como funciona as ferramentas do blogger.

 

O que você precisa é uma paginação com ajax, de uma pesquisada por este termo no google, tem bastante conteúdo a respeito.

 

Então ai que está o problema o blogger (pelo que eu sei_) não usa php e tudo que eu pesquiso sobre paginação com ajax e pra php ou usa php ai eu não consigo adaptar...

Compartilhar este post


Link para o post
Compartilhar em outros sites
1 hora atrás, Alice Marie disse:

 

Então ai que está o problema o blogger (pelo que eu sei_) não usa php e tudo que eu pesquiso sobre paginação com ajax e pra php ou usa php ai eu não consigo adaptar...

Então, você vai precisar de uma linguagem de programação pra fazer a consulta no banco de dados e pegar as novas notícias.

O fluxo é basicamente:

 

Ajax requisita arquivo PHP.

Arquivo PHP consulta o banco de dados.

Arquivo PHP retorna as novas notícias pro Ajax.

Ajax substitui o DIV com as novas notícias.

Compartilhar este post


Link para o post
Compartilhar em outros sites
11 horas atrás, Alice Marie disse:

 

Então ai que está o problema o blogger (pelo que eu sei_) não usa php e tudo que eu pesquiso sobre paginação com ajax e pra php ou usa php ai eu não consigo adaptar...

 

Ajax não tem relação direta com PHP. Ele "consome" conteúdo que é disponibilizado por alguma página em PHP.

No caso, você pode consultar um arquivo XML (algum feed, por exemplo) e exibir as informações. 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por ILR master
      Fala pessoal, tudo bem?
       
      Eu tenho o seguinte código:
       
      <script>
         $(function(){
      var jElement = $('.fixar_banner');
      $(window).scroll(function(){
          if ( $(this).scrollTop() > 120 ){
              jElement.css({
                  'position':'fixed',
                  'top':'10px'
              });
          }else{
              jElement.css({
                  'position':'relative',
                  'top':'auto'
              });
          }
      });
      });
      </script>
       
      Porém, eu quero que a div fique fixa até que outro elemento apareça na tela, tipo o rodapé da página por exemplo. É mais ou menos como a página de notícia do uol.
      https://noticias.uol.com.br/internacional/ultimas-noticias/2025/01/19/sonho-americano-brasileiros-moram-em-carro-e-buscam-comida-no-lixo-nos-eua.htm
       
      Espero ter sido claro.
       
      Obrigado :)
       
    • Por violin101
      Caros amigos, saudações.

      Estou com uma dúvida, referente cálculo de valores em tempo real.

      Tenho uma rotina, que faz o cálculo, o problema é mostrar o resultado.

      Quero mostrar o RESULTADO assim: 0,00  ou  0.00

      Abaixo posto o código.
      jQuery('input').on('keyup',function(){ //Remover ponto e trocar a virgula por ponto var m = document.getElementById("pgRest").value; while (m.indexOf(".") >= 0) { m = m.replace(".", ""); } m = m.replace(",","."); //Remover ponto e trocar a virgula por ponto var j = document.getElementById("pgDsct").value; while (j.indexOf(".") >= 0) { j = j.replace(".", ""); } j = j.replace(",","."); m = parseFloat(jQuery('#pgRest').val() != '' ? jQuery('#pgRest').val() : 0); j = parseFloat(jQuery('#pgDsct').val() != '' ? jQuery('#pgDsct').val() : 0); //Mostra o Resultado em Tempo Real jQuery('#pgTroco').val(m - j); <<=== aqui estou errando })  
       
      Grato,
       
      Cesar
       
       
    • Por violin101
      Caro amigos, saudações.

      Tenho uma tabela escrita em JS que funciona corretamente.
       
      Minha dúvida:
      - como devo fazer para quando a Tabela HTML estiver vazia, exibir o LOGO da Empresa ?

      Abaixo posto o script:
      document.addEventListener( 'keydown', evt => { if (!evt.ctrlKey || evt.key !== 'i' ) return;// Não é Ctrl+A, portanto interrompemos o script evt.preventDefault(); //Chama a Função Calcular Qtde X Valor Venda calcvda(); var idProdutos = document.getElementById("idProdutos").value; var descricao = document.getElementById("descricao").value; var prd_unid = document.getElementById("prd_unid").value; var estoque_atual = document.getElementById("estoque_atual").value; var qtde = document.getElementById("qtde").value; var vlrunit = document.getElementById("vlrunit").value; var vlrtotals = document.getElementById("vlrtotal").value; var vlrtotal = vlrtotals.toLocaleString('pt-br', {minimumFractionDigits: 2}); if(validarConsumo(estoque_atual)){ //Chama a Modal com Alerta. $("#modal_qtdemaior").modal(); } else { if(qtde == "" || vlrunit == "" || vlrtotal == ""){ //Chama a Modal com Alerta. $("#modal_quantidade").modal(); } else { //Monta a Tabela com os Itens html = "<tr style='font-size:13px;'>"; html += "<td width='10%' height='10' style='text-align:center;'>"+ "<input type='hidden' name='id_prds[]' value='"+idProdutos+"'>"+idProdutos+"</td>"; html += "<td width='47%' height='10'>"+ "<input type='hidden' name='descricao[]' value='"+descricao+"'>"+descricao+ "<input type='hidden' name='esp[]' value='"+prd_unid+"'> - ESP:"+prd_unid+ "<input type='hidden' name='estoq[]' value='"+estoque_atual+"'></td>"; html += "<td width='10%' height='10' style='text-align:center;'>"+ "<input type='hidden' name='qtde[]' value='"+qtde+"'>"+qtde+"</td>"; html += "<td width='12%' height='10' style='text-align:right;'>"+ "<input type='hidden' name='vlrunit[]' value='"+vlrunit+"'>"+vlrunit+"</td>"; html += "<td width='14%' height='10' style='text-align:right;'>"+ "<input type='hidden' name='vlrtotal[]' value='"+vlrtotal+"'>"+vlrtotal+"</td>"; html += "<td width='12%' height='10' style='text-align:center;'>"+ "<button type='button' class='btn btn-uvas btn-remove-produto' style='margin-right:1%; padding:1px 3px; font-size:12px;' title='Remover Item da Lista'>"+ "<span class='fa fa-minus' style='font-size:12px;'></span></button></td>"; html += "</tr>"; $("#tbventas tbody").append(html); //Função para Somar os Itens do Lançamento somar(); $("#idProdutos").val(null); $("#descricao").val(null); $("#prd_unid").val(null); $("#qtde").val(null); $("#vlrunit").val(null); $("#vlrtotal").val(null); $("#idProdutos").focus(); //Se INCLUIR NOVO produto - Limpa a Forma de Pagamento $("#pgSoma").val(null); $("#pgRest").val(null); $("#pgDsct").val(null); $("#pgTroco").val(null); $("#tbpagar tbody").empty(); }//Fim do IF-qtde }//Fim do Validar Consumo });//Fim da Função btn-agregar  
      Grato,

      Cesar
       
    • Por violin101
      Caros amigos, saudações.

      Estou com uma pequena dúvida se é possível ser realizado.

      Preciso passar 2 IDs para o Sistema executar a função, estou utilizando desta forma e gostaria de saber como faço via JS para passar os parâmetro que preciso.

      Observação:
      Dentro da TABELA utilizei 2 Forms, para passar os IDS que preciso, funcionou conforme código abaixo.
      <div class="card-body"> <table id="tab_clie" class="table table-bordered table-hover"> <thead> <tr> <th style="text-align:center; width:10%;">Pedido Nº</th> <th style="text-align:center; width:10%;">Data Pedido</th> <th style="text-align:center; width:32%;">Fornecedor</th> <th style="text-align:center; width:10%;">Status</th> <th style="text-align:center; width:5%;">Ação</th> </tr> </thead> <tbody> <?php foreach ($results as $r) { $dta_ped = date(('d/m/Y'), strtotime($r->dataPedido)); switch ($r->pd_status) { case '1': $status = '&nbsp;&nbsp;Aberto&nbsp;&nbsp;'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#000000'; //Cor: Preta break; case '2': $status = 'Atendido Total'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#086108'; //Cor: Verde break; case '3': $status = 'Atendido Parcial'; $txt = '#000000'; //Cor: Branco $cor = '#FEA118'; //Cor: Amarelo break; default: $status = 'Cancelado'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#D20101'; //Cor: Vermelho break; } echo '<tr>'; echo '<td width="10%" height="10" style="text-align:center;">'.$r->pd_numero.'</td>'; echo '<td width="10%" height="10" style="text-align:center;">'.$dta_ped.'</td>'; echo '<td width="32%" height="10" style="text-align:left;">'.$r->nome.'</td>'; echo '<td width="10%" height="10" style="text-align:left;"><span class="badge" style="color:'.$txt.'; background-color:'.$cor.'; border-color:'.$cor.'">'.$status.'</span></td>'; echo '<td width="5%" style="text-align:center;">'; ?> <div class="row"> <?php if($this->permission->checkPermission($this->session->userdata('permissao'), 'vPedido')){ ?> <form action="<?= base_url() ?>compras/pedidos/visualizar" method="POST" > <input type="hidden" name="idPedido" value="<?php echo $r->idPedidos; ?>"> <input type="hidden" name="nrPedido" value="<?php echo $r->pd_numero; ?>"> <button class="btn btn-warning" title="Visualizar" style="margin-left:50%; padding: 1px 3px;"><i class="fa fa-search icon-white"></i></button> </form> <?php } if($this->permission->checkPermission($this->session->userdata('permissao'), 'ePedido')){ ?> <form action="<?= base_url() ?>compras/pedidos/editar" method="POST" > <input type="hidden" name="idPedido" value="<?php echo $r->idPedidos; ?>"> <input type="hidden" name="nrPedido" value="<?php echo $r->pd_numero; ?>"> <button class="btn btn-primary" title="Editar" style="margin-left:50%; padding: 1px 3px;"><i class="fa fa-edit icon-white"></i></button> </form> <?php } ?> </div> <?php echo '</td>'; echo '</tr>'; } ?> </tbody> </table> </div>
      Grato,

      Cesar.
    • Por belann
      Olá!
       
      Estou usando o editor quill em uma página html, sem fazer a instalação com npm, mas usando as api´s via internet com http, no entanto não consigo fazer a tecla enter funcionar para mudança de linha, tentei essa configuração abaixo, mas não funcionou.
       
      modules: {       syntax: true,       toolbar: '#toolbar-container',       keyboard: {         bindings: {           enter: {             key: 13,             handler: function(range, context) {                       quill.formatLine(range.index, range.length, { 'align': '' });             }           }  
       
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.