Un utente ha chiesto
Categoria: Sugar and Spice di WordPress
Domanda: Sposta la sezione dei commenti sopra

Ciao! Voglio spostare la sezione dei commenti più in alto nella mia pagina del post per una localizzazione più semplice. Come posso ottenerlo sopra le sezioni “correlati” e “navigazione”? Se hai bisogno di vederlo, questo è il link al mio blog: http://www.pintucksandpeonies.com/20-ways-think-pink-wimw/

Grazie mólto!

  • (@crouchingbruin)

    Normalmente qualcosa del genere potrebbe essere fatto usando solo CSS, ma sfortunatamente la sezione Articoli correlati è integrata nel contenitore dei post, quindi richiederà una combinazione di CSS e JavaScript (non preoccuparti di tutti i termini tecnici, la soluzione non è difficile ).

    Dovrai installare due plugin: Header e Footer, che ti permetteranno di aggiungere codice script, e Custom CSS Manager, che ti permetterà di aggiungere CSS. Vedo che hai installato JetPack e JetPack ha un’opzione CSS personalizzata, ma il suo editor non sta salvando scatola flessibile proprietà correlate per qualche strana ragione. Puoi installare facilmente i plugin andando su Plugin → Aggiungi nuovo dal pannello di amministrazione.

    Una volta installati e attivati ​​i plugin, quindi:

    1. Vai a Impostazioni → Intestazione e piè di pagina dal pannello di amministrazione.
    2. Nel primo campo, intitolato Codice da aggiungere nella sezione HEAD di ogni pagina, copia e incolla questo codice JavaScript:
      <script>
      jQuery(document).ready(function($){
         // Moves the JetPack's Related Posts section into the #content container
         $("#jp-relatedposts").appendTo("#content");
      });
      </script>

      Questo script sposterà la sezione Articoli correlati nello stesso contenitore della sezione dei commenti e della sezione di navigazione.

    3. Cliccalo Salva pulsante in basso in basso.
    4. Ora vai a Aspetto → Gestore CSS personalizzato dal pannello di amministrazione.
    5. Copia e incolla questo CSS nel Codice CSS campo:
      #content {
         display: -webkit-flex;
         display: flex;
         -webkit-flex-direction: column;
         flex-direction: column;
         -webkit-align-content: stretch;
         align-content: stretch;
      }
      article {
         order: 1;
      }
      #comments {
         order: 2;
      }
      #jp-relatedposts {
         order: 3;
      }
      #nav-below {
         order: 4;
      }

      Questo CSS imposta qualcosa chiamato scatola flessibile e consente di riorganizzare l’ordine degli elementi all’interno del contenitore flexbox. Puoi vedere che ho impostato l’ordine dei post, seguito dai commenti, quindi dai post correlati e infine dalla sezione di navigazione.

    6. Cliccalo Salvare le modifiche pulsante in basso in basso.

    Dovrebbe farlo.

    (@pintucksandpeonies)

    Incredibile, ha funzionato perfettamente! Un milione di grazie! Non l’avrei mai capito da solo.

Hai risolto il tuo problema?

0 / 0

Lascia un commento 0

Il tuo indirizzo email non sarà pubblicato. Required fields are marked *