Nola gehitu artikulu-txartelaren estiloa WordPress-en? Txertatu kode laburra artikulu-txartelaren formularioan

WordPressNola optimizatu webgunearen barne estekak?

Sortu kode laburrak miniatura-artikuluekin eta editore-botoiekin

Webgunearen barne esteken optimizazioa, urteanSEOEstekak beti izan dira oso garrantzitsuak, eta lotura egitura ona oso onuragarria da SEOrentzat.

Uneko artikulua beste artikulu batzuekin lotuta badago, gehitu automatikoki orrialderako esteka:

• bilatzaileen armiarmak arakatzeko kopurua eta sakonera asko handituko ditu,
• erregistro kopurua handitzen lagundu,
• Eta aingura testuaren gako-hitzen pisua.

Artikulu zahar batzuk eguneratzen badira, bilatzaileen armiarmari ere agindu diezaiekezu artikulu zaharren edukien eguneraketak berriro arakatzeko eta indexatzeko, artikulu berriei barne estekak gehituz.

• Barne-lotura ohiko bat testu-esteka bat da, bere egitura aingura-testua da.
• Baina erabiltzailearen esperientzia hobetzeko, barruko orrialdeko artikuluen estekak gehiago optimiza ditzakegu.

irakurtzen duzuneanChen WeiliangBlogean idazten duzunean, sarritan aurki dezakezu honelako artikulu-txartel bat txertatzen duzula, artikuluaren edukiaren laburpena duen miniatura-artikulu batekin, adibidez:

Nola eskatu Hong Kongeko telefono-zenbaki bat?Hong Kongeko telefono mugikor birtuala SMS egiaztapen-kodea jasotzeko

eSender Hong Kongeko telefono-zenbakiaren deskontu-kodea: DM6888 Non eros dezaket Hong Kong-eko telefono-zenbaki bat?Hong Kongeko dei-txartelaren operadore birtuala gomendatzen da eSender Boyuan Information Group-eko telefono mugikorren zerbitzu birtual bat da. Boyuan Information-k sukurtsalak ezarri ditu Guangzhoun eta Hong Kongen, Txinan,...

XNUMX. Gehitu kapsulatutako artikulu-txartelaren estiloko kode labur bat

步 1:Gehitu PHP kodea

Gehitu kode hau zure WP gaiaren functions.php fitxategira:

/**
* 加入内部文章缩略图 By 陈沩亮
* 文章地址：https://www.chenweiliang.com/cwl-638.html
**/
function cwl_insert_posts( $atts, $content = null ){
extract( shortcode_atts( array(
'ids' => ''
),
$atts ) );
global $post;
$content = '';
$postids = explode(',', $ids);
$inset_posts = get_posts(array('post__in'=>$postids));
foreach ($inset_posts as $key => $post) {
setup_postdata( $post );
$content .= '<div class="jiawen"><div class="fl"><a target="_blank" href="' . get_permalink() . '" class="fl"><i class="sui sui-link sui-fw"></i>';
$content .= get_the_title();
$content .= '</a><p class="note"><a target="_blank" rel="nofollow" href="' . get_permalink() . '">';
$content .= mb_strimwidth(strip_tags(apply_filters('post_content', $post->post_content)), 0, 180, '...');
$content .= '</a></p></div><div class="fr"><a target="_blank" rel="nofollow" href="' . get_permalink() . '"><img src=';
$content .= cwl_thumbnail_src();
$content .= ' class="jiawen-thumb" alt="' . get_the_title() . '" title="' . get_the_title() . '"></a></div></div>';
}
wp_reset_postdata();
return $content;
}
add_shortcode('jiawen', 'cwl_insert_posts');

// 加入内部文章缩略图
function cwl_thumbnail_src() {
global $post;
if ( get_post_meta($post->ID, 'thumbnail', true) ) { //如有缩略图，就显示缩略图
$image = get_post_meta($post->ID, 'thumbnail', true);
return $image;
} else {
if ( has_post_thumbnail() ) { //如有缩略图，就显示缩略图
$img_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "Full");
return $img_src[0];
} else {
$content = $post->post_content;
preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
$n = count($strResult[1]);
if($n > 0){
return $strResult[1][0]; //若无缩略图，就调用文中第一张图片作缩略图
}else {
$random = mt_rand(1, 20);
return get_template_directory_uri().'/img/random/'. $random .'.jpg'; //文章中若无图片，就随机读取在 random 文件夹内的图片作缩略图
}
}
}
}

Hiperesteka ikonoa agertzen ez bada, goikoa ordeztu behar duzuCSSHonetaz fa fa-link fa-fw, to sui sui-link sui-fw

• Mesedez, egiaztatu zure WP gaia, ba al dago /img/random/ karpetarik?
• (ez bada, sortu mesedez)
• Ondoren, ausazko fitxategian, gehitu 20 jpg irudi.

Irudiak 1etik 20ra arteko izenak dira:

• 1.jpg
• 2.jpg
• ... (eta abar)
• 20.jpg

步 2:Gehitu CSS kodea

Gehitu kode hau zure WP gaiaren style.css fitxategira:

/*加入内部文章CSS*/
.fl{float:left;}
.fr{float:right;}
.jiawen{margin-bottom:25px;padding:10px;width:100%;height:100%;border:1px solid #e8e8e8;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.1);cursor:pointer;-webkit-transition:box-shadow 218ms;-moz-transition:box-shadow 218ms;-o-transition:box-shadow 218ms;transition:box-shadow 218ms;overflow:hidden;}
.jiawen:hover{box-shadow:0 1px 8px 1px rgba(0,0,0,.1);}
.jiawen .fl{width:72%;}
.jiawen .fr{padding:10px 5px;width:24%;}
.jiawen .fl a{display:block;margin-right:15px;padding:8px 0;width:100%;height: 100%;color:#8463a9!important;text-decoration:none;font-size:16px;border:none;overflow: hidden;}
.jiawen .fl .note{margin:0 0 5px;padding-left:10px;height:150px;color:#888;font-size:14px;}
.jiawen .jiawen-thumb{width:170px;height:120px;margin-top: 10px;}
@media only screen and (max-width: 700px){.jiawen .jiawen-thumb {width: auto;height: auto;}}

XNUMX. Deitu kode laburra kapsulatutako artikulu-txartel baten moduan (kode laburra)

Labur-kodeak zuzenean sar ditzakezu artikulu-editorearen "Ikusuala" edo "Testua" interfazean 【jiawen ids =postID1,postID2 ...】 formatuko deia.

Esate baterako, barne estekatutako 3 artikulu bistaratu nahi baditut, kode laburra sartu besterik ez dut:

• 【jiawen ids=526,380,411】
• 5 artikulu ID baino gehiago sartzen badituzu, gehienez 5 artikulu baino ez dira bistaratuko
• Artikulu hau kode laburrak ihes egitea saihesteko erabiltzen da []
• Labur-kodea erabiltzean, aldatu [] []-ra []

Efektua honako hau da ▼

Nola lortu zuen Mimeng-en kontu publikoak eta zergatik da hain ezaguna? Arrazoiak daude atzean

Nola izan zen Mimi Meng-en kontu ofiziala arrakastatsua? Zergatik da hain ezaguna? Kausaren atzean indar eragile bat dago! Mi Meng-ek 2012ko irailaren 9ean WeChat-en kontu publikoak idazten hasi zenetik, 15 jarraitzaile lortu zituen bi hilabetetan, jende askoren lorpenak berehala gaindituz, eta horrek jende askoren jakin-mina piztu zuen.

Tang Seng-en lau irakasle eta ikastunek WeChat-eko lagunen kontaktuei buruz eztabaidatu zuten, eta Sun Wukong-en hitzaldiak zur eta lur utzi ninduen

Tang Sanzang eta bere lau ikasleek WeChat-eko lagunen sareaz eztabaidatu zuten Sun Wukong-en diskurtsoak bat-batean argitu ninduen. Jaja, ez nuen espero Sun Wukong-en hitzaldiak bat-batean argituko ninduenik...

Komunikabide berrien garaian erabiltzaileen irakurketaren ezaugarri psikologikoen analisia: 7 hauek menperatzen badituzu, irabaziko duzu

Erabiltzaileen irakurketaren ezaugarri psikologikoen analisia komunikabide berrien garaian: 7 hauek menperatzen badituzu, dirua irabaziko duzu Sarrera WeChat kontu publiko bat martxan jartzea lortu nahi badugu, giza izaera aztertu behar dugu, erabiltzaileen irakurketaren psikologia aztertu eta erabiltzailearen irakurketa-jokabidea hobeto ulertuko dugu.

WordPress editorean labur kodea erabiltzen ari ez bazara eta beste nonbait deitu nahi baduzu, honako kode honekin deitu dezakezu:

do_shortcode（'[neilian ids ids = postID1，postID2]'）

XNUMX. Gehitu editore-botoia

Aldi bakoitzean kode laburra eskuz sartu behar baduzu, astuna iruditzen zait, zer egin behar dut?

WordPress-en ahalmena gauza konplexuak sinplifikatzeko aukera ematen digu ^_^

1) Gehitu editorearen testu-botoia

WordPress-ek TinyMCE editorea du lehenespenez. TinyMCE editorearen testu-interfazean laster-tekla-botoiak gehi ditzakegu.

3. urratsa:Gehitu lasterbide-botoien kodea

• Mesedez, gehitu kodea zuzenean functions.php fitxategian ▼

//加入内部文章，TinyMCE 编辑器文本按钮
add_action('after_wp_tiny_mce', 'add_button_mce');
function add_button_mce($mce_settings) {
?>
<script type="text/javascript">
 QTags.addButton( 'jw', '加入内部文章', '', '');
 </script>
<?php
}

注意 事项

Editorearentzat beste kode bat gehitu baduzu lasterbide-botoiak pertsonalizatzeko, besterik gabe<script type="text/javascript"> Jarraian, gehitu hurrengo kodea ▼

QTags.addButton( 'jw', '加入内部文章', '', '');

Bestela gaizki aterako da.

2) Gehitu editorea bistaratzeko botoia

WordPress-eko artikuluak editatzen ditugunean, interfaze lehenetsia Bisuala izan ohi da.

Beraz, hobe da editore bisualean ere botoi bat gehitzea.

• Funtzionalitate hau kodean inplementa daitekeen arren, pixka bat konplikatua da hasiberri askorentzat.
• Adituentzat zaila da, gaiari JS kodea gehitzea beharrezkoa delako, eta gaia aldatzen baduzu, berriro gehitu behar duzu, eta urratsak bereziki astunak dira.

步 4:Instalatu eta gaitu pluginak

• Chen WeiliangPluginak gomendatzen dira:Ikusizko editorea Botoi pertsonalizatuak

Instalazioa amaitu ondoren, ezkerreko menu-barraren azpian, engranajearen ikono batekin Ikusizko Editoreen Botoi pertsonalizatuak agertuko dira ▼

步 5:Egin klik Gehitu berria

• Sortu botoi pertsonalizatu bat, edozein izen.
• Adibidez: barne-artikuluak gehitzea 

▼ konfiguratzeko, beheko irudia jarraitu besterik ez duzu behar

步 6: Botoiaren edukia aukera

• Hautatu Wrap aukeraketa.

步 7: Ezarri aurretik

• Bete shortcode

8. urratsa:Bistaratu Editor-en ezarpenak

• Ikusizko editorea edo testu editorea erakusteko botoiak egiaztatu ditzakezu.
• Kontuan izan Testu-editorea markatuta badago, goiko "Gehitu lasterbide-botoiaren kodea" salta dezakezula, bestela errepikatuko da.

9. urratsa:Botoiaren ikonoaren aukerak

• Goitibeherako aukeren menuan, hautatu Markoa ikonoa.

10. urratsa:Probatu

• Azkenean, noski, zure esku dago efektua zuk zeuk probatzea ^_^
• Goiko urratsak zuzenak badira, botoia ikusiko duzu behean ikusten den editorearen interfaze bisualean ▼