Adăugați o imagine recomandată pe postările individuale

Publicat: 2013-10-10

Imaginea prezentată din arhivele dvs. (miniatura postării) va fi extrasă din imaginea prezentată, indiferent de modul în care o adăugați pe ecranul Editați postarea.

Imaginea afișată înainte sau după titlul unei singure postări este extrasă din prima imagine pe care o inserați în postare, cu excepția cazului în care o eliminați.

Puteți să eliminați sau să modificați codul care afișează o imagine înainte sau după titlurile unei singure postări folosind unul dintre fragmentele de cod de pe această pagină.

Dacă adăugați o imagine ca imagine prezentată, aceasta va fi afișată în arhivele dvs. ca o miniatură a postării și nu ca imagine prezentată după titlul postării unice.

Dacă nu adăugați o imagine prezentată, prima imagine din postarea dvs. va fi afișată înainte sau după titlurile postării individuale, precum și pe paginile dvs. de arhivă.

În această postare, vă voi oferi câteva rânduri de cod PHP pe care le puteți lipi pur și simplu la sfârșitul fișierului functions.php pentru temele copilului.

Codul vă va permite să afișați imaginea postării, înainte sau după titlu, pe postările individuale.

postați imaginea înainte de un singur titlu

Dan a pus această întrebare recent:

Mi-am bătut mintea căutând, folosind un alt cod găsit pe acest forum și am făcut o nouă postare.

Folosind Minimum Pro, aș dori pur și simplu să afișez imaginea recomandată a unei postări într-o pagină de „post-are unică”. De preferință deasupra conținutului textului. Am găsit cod pe acest forum și l-am pus în functions.php. Este afișată imaginea recomandată, dar a șters simultan conținutul textului. Deci, evident că fac ceva greșit.

Notă: Vă rugăm să utilizați ultimul fragment de cod PHP din această postare dacă rulați vechiul marcaj XHTML și nu HTML 5, deoarece hook-urile s-au schimbat.

Afișează imaginea recomandată după titlu

Acest cod afișează imaginea după titlul postării.

 add_action( 'genesis_entry_header', 'single_post_featured_image', 15 ); function single_post_featured_image() { if ( ! is_singular( 'post' ) ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

Afișează imaginea recomandată înainte de titlu

Acest cod vă afișează imaginea înainte de titlul postării.

 add_action( 'genesis_entry_header', 'single_post_featured_image', 5 ); function single_post_featured_image() { if ( ! is_singular( 'post' ) ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

Afișați imaginea recomandată pe pagini statice

Dacă doriți ca acest lucru să funcționeze și pentru pagini unice statice, pur și simplu adăugați o pagină la cod astfel:

 add_action( 'genesis_entry_header', 'single_post_featured_image', 5 ); function single_post_featured_image() { if ( ! is_singular( 'page' ) ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

Afișați imaginea recomandată pe pagini statice și postări unice

Dacă doriți ca acest lucru să funcționeze și pentru pagini și postări statice, pur și simplu adăugați o pagină la cod ca acesta:

 add_action( 'genesis_entry_header', 'single_post_featured_image', 5 ); function single_post_featured_image() { if ( ! is_singular() ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

Poziția pe care o afișează imaginea prezentată poate fi determinată folosind al treilea parametru pentru prioritatea de poziționare.

În codul de mai sus, este doar o chestiune de schimbare a celui de-al treilea parametru de la 5 la 15.

Schimbați dimensiunea imaginii

Iată un exemplu de utilizare a unei dimensiuni mari conform setărilor tale media.

 add_action( 'genesis_entry_header', 'single_post_featured_image', 15 ); function single_post_featured_image() { if ( ! is_singular( 'post' ) ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => 'large', 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

De asemenea, puteți utiliza oricare dintre celelalte dimensiuni implicite configurate în Setări > Media.

  • miniatură
  • mediu
  • mare
  • deplin

De asemenea, puteți utiliza orice dimensiuni personalizate pe care le-ați adăugat în fișierul cu funcții.

Exemplu:

portofoliu

 add_image_size( 'portfolio', 540, 340, TRUE );

Folosind Old XHTML Loop Hooks

Dacă încă rulați XHTML și nu v-ați convertit încă în HTML 5, va trebui să utilizați vechile Loop Hooks:

 add_action( 'genesis_before_post_title', 'single_post_featured_image' ); function single_post_featured_image() { if ( ! is_singular( 'post' ) ) return; $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img ); }

Adăugarea de spațiu între titlu și imagine

Iată un exemplu de cod CSS pe care îl puteți adăuga la sfârșitul fișierului style.css cu teme pentru copii înainte de codul pentru Interogări media, care adaugă o marjă între imaginea prezentată și titlul intrării pe postările individuale.

 .single .post-image { margin-bottom: 30px; }

Utilizați acest exemplu pentru pagini:

 .page .post-image { margin-bottom: 30px; }

Aliniați imaginea recomandată (post-imagine) la dreapta

De asemenea, puteți alinia imaginile postării la dreapta.

Pur și simplu adăugați acest cod CSS înainte de interogările media, aproape de sfârșitul fișierului style.css cu temele copil:

 .single .post-image { float:right; margin:0 0 1em 1em; width: 285px; height: 285px; }

Codul de mai sus va alinia imaginea pe care o adăugați ca imagine prezentată în toate postările individuale din dreapta conținutului dvs., astfel încât textul său să fie împachetat astfel:

postați imaginea

De asemenea, puteți adăuga clasa alignright la codul PHP, în loc să utilizați CSS.

 'class' => 'alignright'

Pur și simplu înlocuiți imaginea post-imagine în codul PHP cu alignright și textul dvs. se va înfășura în jurul imaginii dvs. din partea dreaptă a conținutului.

Aliniați imaginea recomandată (post-imagine) la stânga

De asemenea, puteți alinia imaginile prezentate în postările individuale la stânga.

 .single .post-image { float:left; margin: 1em 1em 0 0; width: 200px; height: 200px; }

Și iată rezultatul:

plutește la stânga

De asemenea, puteți adăuga clasa alignleft la codul PHP, în loc să utilizați CSS.

 'class' => 'alignleft'

Pur și simplu înlocuiți imaginea post-imagine în codul PHP cu alignleft și textul dvs. se va înfășura în jurul imaginii dvs. din partea stângă a conținutului.

Notă : Acest cod CSS se aplică temelor secundare Genesis 2.0 HTML 5 și este posibil să nu funcționeze pe alte teme care utilizează o clasă diferită pentru imaginile postate/imaginile prezentate.

Eliminați un link href din imaginea prezentată

Un membru m-a întrebat cum să elimin linkul din cod, așa că iată-l:

Pur și simplu înlocuiți această parte a codului:

 $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img );

Cu asta:

 $img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'post-image' ) ) ); echo $img;

postări asemănatoare

  • 2 moduri de a utiliza diferite imagini prezentate pentru postări unice și pagini de arhivă
  • Titlul intrării peste imaginea prezentată pe postările individuale
  • Casetă de selectare Pentru a adăuga sau elimina o imagine recomandată pe postări sau pagini individuale
  • Conectați imaginea recomandată la adresa URL personalizată
  • Personalizați afișarea imaginilor prezentate pe postările individuale
  • Adăugați o imagine recomandată înainte de conținut în orice temă
  • Setați imaginea recomandată de rezervă pentru fiecare categorie