Slik viser du aktuelle innlegg med miniatyrbilder i WordPress

Det er mange måter som deles på nettet for å vise Anbefalte innlegg. Men nesten alle funksjoner og plugins mangler noe. I denne opplæringen deler vi en funksjon som tillater brukere å velge bestemte post-IDer og vise dem som populære innlegg med miniatyrbilder ved å bruke WordPress Post Thumbnail-funksjonen som ble lagt til i WordPress 2.9. På denne måten kan du unngå å bruke Sticky innlegg som noen ganger kan være nødvendige på grunn av andre funksjoner i et tilpasset prosjekt.

Merk: Dette er en veiledning fra flere deler, så vi anbefaler at du har kunnskap om WordPress, PHP, HTML og CSS.

Vi endret pluginet Utvalgte innleggslister av San of W3C Gallery. Selv om San har opprettet en avansert versjon av pluginet for å vise bilder, krever det et tilpasset felt. På denne måten vil du bare bruke Post Thumbnail-funksjonen i 2.9.

Sluttprodukt

Modifisert plugin

Først må du lime inn koden nedenfor i din functions.php fil ELLER i en egen fil og last den opp som et plugin.

posten(); ?>        "); $ ol_flash ="; $ posts_settings = get_option ('posts_settings'); // ADMIN PANLE SEETTING funksjon posts_add_pages () // Legg til ny meny i Innstillings- eller Alternativer-fanen: add_options_page ('Featured Posts List', 'Featured Posts List', 8, 'postsoptions', 'posts_options_page');  / * Definer konstanter og variabler * / define ('PLUGIN_URI', get_option ('siteurl'). '/ Wp-innhold / plugins /'); / * Funksjoner * / funksjon posts_options_page () global $ ol_flash, $ posts_settings, $ _POST, $ wp_rewrite; hvis (isset ($ _ POST ['posts_id'])) $ posts_settings ['posts_id'] = $ _POST ['posts_id']; update_option ( 'posts_settings', $ posts_settings); $ ol_flash = "Din valgte liste har blitt lagret.";  hvis ($ ol_flash! = ") ekko '
'. $ ol_flash. '
'; ekko ''; ekko '
Legg til innlegg ID for å opprette utvalgt innleggsliste
'; ekko '
 
Denne plugin gir full frihet til å vise flere innlegg som Utvalgt innleggsliste på nettstedet ditt.
 
Post-ID:
 
SAN Hint: For å legge til flere post-IDer, bruk "," for exmple: "1, 2, 3" 
 
'; ekko ' 
Lim inn denne koden til hvor du vil at den skal vise utvalgt innleggsliste  
 Eller du kan passere variabel før og etter som denne standardinnstillingen ", $ etter = ")?>
 '; ekko '';  add_action ('admin_menu', 'posts_add_pages'); ?>

Når du har gjort det, kan du vise det ved å lime koden hvor som helst i malfilen din:

Tilpasset CSS

Vi bruker tilpassede CSS-klasser, så du trenger dem også. Lim inn følgende kode i din style.css-fil.

.popcontainer border-bottom: 1px solid # D0CDC5; bredde: 274px; flyte: venstre; polstring: 0 0 15px 0; margin: 0 0 15px 0;  .pofthumb bredde: 60px; flyte: venstre; bakgrunn: # D0CDC5; polstring: 5px; margin: 0 10px 0 0;  .popcontent bredde: 185px; flyte: venstre;  .popcontent h2 font-size: 13px; margin: 0 0 3px 0; polstring: 0;  .popcontent h2 a text-decoration: none; 

Avanserte instillinger

Ovennevnte kode vil trekke standard miniatyrbildet og vise det med posttittel og datoen posten ble publisert. Det eneste problemet er at hvis du vil bruke en annen størrelse på miniatyrbildet. Temaet ditt kan bruke miniatyrfunksjonen andre steder, slik at du ikke kan bruke to forskjellige størrelser med gjeldende koder. Så du må tilpasse det litt og legge til en ny bildestørrelse.

Åpne dine funksjoner.php og finn miniatyrkodene og legg til følgende kode:

add_theme_support ('post-miniatyrer'); set_post_thumbnail_size (150, 150, true); // Normal post miniatyrer add_image_size ('featured-thumbnail', 60, 60); // Utvalgte miniatyrstørrelse

Finn nå følgende linje i pluginet ovenfor:

og erstatt den med:

Dette vil tillate deg å ha to forskjellige størrelser.

Et annet kjent problem ville være hvis miniatyrbildet ditt ikke er proporsjonalt, det ville føre til at et mindre bilde vises i stedet for 60 x 60px fordi WordPress ikke har beskjæringsevnen. For å unngå at du kan bruke ekstra bildeformatplugin som har mulighet til å beskjære. Navngi den egendefinerte bildestørrelsen som utvalgt-miniatyrbilde og bruk samme kode som ovenfor for å erstatte den opprinnelige koden.

Den eneste grunnen til at vi brukte denne metoden, var at vi brukte klare innlegg for å vise en annen liste. Du kan også oppnå dette ved å bruke klissete innlegg. For miniatyrbildet, valgte vi tilleggstilleggspluggen fordi vi vil unngå å bruke TimThumb JavaScript og vedlikeholde et raskt lastingssted.

Hvis du har flere løsninger på dette problemet, vennligst del det med oss ​​i kommentarene.