WordPressке макала картасынын стилин кантип кошсо болот? Макала картасынын формасына кыска кодду кыстарыңыз

WordPress веб-сайтындагы ички шилтемелерди кантип оптималдаштыруу керек ?

Эскиз макалалары жана Редактор баскычтары менен кыска коддорду түзүңүз

Ички шилтемелерди оптималдаштыруу SEOдо ар дайым абдан маанилүү , анткени жакшы шилтеме түзүмү издөө системасын оптималдаштыруу үчүн абдан пайдалуу.

Учурдагы макала башка макалаларга байланыштуу болсо, автоматтык түрдө баракка шилтемени кошуңуз:

• издөө системасынын жөргөмүштөрүнүн санын жана тереңдигин бир топ жогорулатат,
• жазуулардын санын көбөйтүүгө жардам берет,
• Жана анкердик тексттин ачкыч сөздөрүнүн салмагы.

Эгер кээ бир эски макалалар жаңыртылган болсо, сиз издөө системасынын жөргөмүштөрүнө жаңы макалаларга ички шилтемелерди кошуу менен эски макалалардын мазмуну жаңыртууларын кайра жөрмөлөп жана индекстөө үчүн көрсөтмө берсеңиз болот.

• Ички шилтемелердин кеңири таралган түрү бул тексттик шилтеме, анын түзүлүшү казык текст .
• Бирок колдонуучу тажрыйбасын жогорулатуу үчүн, биз ички беттеги макала шилтемелерин андан ары оптималдаштыра алабыз.

Чен Вэйляндын блог постторун окуганда , көп учурда макаланын мазмунунун кыскача мазмунун камтыган эскиздери бар, мисалы: карточка форматында камтылган макалаларды кездештире аласыз:

Гонконг уюлдук номерине кантип кайрылса болот?SMS текшерүү кодун алуу үчүн Гонконг виртуалдык уюлдук телефон номери

eSender Гонконг уюлдук телефон номеринин арзандатуу коду: DM6888 Гонконгдун уюлдук телефон номерин кайдан сатып алсам болот?Гонконгдун сүйлөшүү картасынын виртуалдык оператору сунушталат eSender Бул Boyuan маалымат тобуна караштуу виртуалдык мобилдик номер кызматы. Boyuan Маалымат Кытайдын Гуанчжоу жана Гонконг шаарларында филиалдарын ачты...

XNUMX. Кыскартылган макала картасы стилинин кыска кодун кошуңуз

1-кадам: PHP кодун кошуу

WP темаңыздын functions.php файлына төмөнкү кодду кошуңуз:

/**
* 加入内部文章缩略图 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 文件夹内的图片作缩略图
}
}
}
}

Эгерде гипершилтеменин сөлөкөтү көрүнбөсө, жогорудагыны алмаштыруу керекCSSбул fa fa-link fa-fw, үчүн sui sui-link sui-fw

• Сураныч, WP темаңызды текшериңиз, /img/random/ папкасы барбы?
• (эгер болбосо, түзүңүз)
• Андан кийин кокустук файлга 20 jpg сүрөт кошуңуз.

Сүрөттөр 1ден 20га чейин аталат:

• xnumx.jpg
• xnumx.jpg
• ... (жана башка)
• xnumx.jpg

2-кадам: CSS кодун кошуңуз

WP темаңыздын style.css файлына төмөнкү кодду кошуңуз:

/*加入内部文章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. Кыска кодду камтылган макала картасы түрүндө чакырыңыз (кыска код)

Сиз кыска коддорду түздөн-түз макала редакторунун "Visual" же "Текст" интерфейсине киргизсеңиз болот 【jiawen ids =postID1,postID2 ...】 формат чалуу.

Мисалы, мен 3 ички шилтемеленген макалаларды көрсөткүм келсе, мен жөн гана кыска кодду киргизем:

• 【jiawen ids=526,380,411】
• Эгер сиз 5тен ашык макала ID киргизсеңиз, эң көп дегенде 5 макала гана көрсөтүлөт
• Бул макала кыска коддордон качуу үчүн колдонулат []
• Кыска кодду колдонууда [] кодун [] деп өзгөртүңүз

Эффект төмөнкүдөй ▼

Мименгдин коомдук аккаунту кантип ийгиликтүү болду жана ал эмне үчүн мынчалык популярдуу болду? Мунун артында себептер бар

Мими Менгдин расмий аккаунту кантип ийгиликтүү болду? Эмне үчүн ал мынчалык популярдуу? Мунун артында кыймылдаткыч күч бар! Ми Мэн 2012-жылдын 9-сентябрында WeChat коомдук аккаунттарын жаза баштагандан бери, ал эки айдын ичинде эле 15 2 жазылуучуга ээ болуп, көптөгөн адамдардын жетишкендиктеринен дароо ашып өтүп, көптөгөн адамдарды абдан кызыктырган.

Тан Сенгдин төрт мугалими жана шакирти WeChat досторунун байланыштарын талкуулашты жана Сун Вуконгдун сүйлөгөнү мени таң калтырды

Танг Санцанг жана анын төрт шакирти WeChat досторунун тармагын талкуулашты. Киришүү: Биз баарыбыз WeChat досторунун тармагын талкуулаган Танг Санзанг, Сун Вуконг жана Ша Вужингди көрдүңүз беле? Хаха, Сун Вуконгдун сөзү мени капысынан жарык кылат деп күткөн эмесмин...

Жаңы медиа доорундагы колдонуучулардын окуусунун психологиялык өзгөчөлүктөрүнө талдоо: эгер сиз бул 7ди өздөштүрүп алсаңыз, сиз киреше табасыз

Жаңы медиа доорунда колдонуучу окуунун психологиялык өзгөчөлүктөрүн талдоо: Эгер сиз бул 7ди өздөштүрүп алсаңыз, анда сиз акча табасыз Киришүү WeChat коомдук аккаунтун иштетүүдө ийгиликке жетүүнү кааласак, анда биз адамдын табиятын изилдеп, колдонуучунун окуу психологиясын талдап, муну менен гана биз өзүбүздүн...

Эгер сиз WordPress редакторунда кыска кодду колдонбосоңуз жана аны башка жерге чакыргыңыз келсе, аны төмөнкү код менен чакырсаңыз болот:

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

XNUMX. Редактор баскычын кошуңуз

Кыска кодду ар бир жолу кол менен киргизүү керек болсо, бул өтө түйшүктүү сезилет, эмне кылышым керек?

WordPressтин күчү бул бизге татаал нерселерди жөнөкөйлөтүүгө мүмкүндүк берет ^_^

1) редактордун текст баскычын кошуу

WordPressте демейки боюнча орнотулган TinyMCE редактору бар. TinyMCE редакторунун текст интерфейсине жарлык баскычтарын кошо алабыз.

3-кадам: Кыска жол баскычынын кодун кошуңуз

• Сураныч, кодду түз functions.php файлына кошуңуз ▼

//加入内部文章，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
}

Коопсуздук чаралары

Жарлык баскычтарын ыңгайлаштыруу үчүн редакторго башка кодду кошсоңуз, жөн гана<script type="text/javascript"> Төмөндө төмөнкү кодду кошуңуз ▼

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

Болбосо туура эмес болуп калат.

2) редактордун визуализация баскычын кошуу

Биз WordPress макалаларын түзөткөндө демейки интерфейс адатта Visual болуп саналат.

Демек, визуалдык редакторго да баскычты кошконуңуз жакшы.

• Бул функцияны коддо ишке ашырууга болот, бирок көптөгөн жаңы келгендер үчүн бул бир аз татаал.
• Бул эксперттер үчүн түйшүктүү, анткени темага JS кодун кошуу керек, ал эми тема өзгөртүлсө, аны кайра кошуу керек, бул абдан түйшүктүү сезилет.

4-кадам: Плагинди орнотуп, иштетиңиз

• Чен ВейлянПлагиндер сунушталат:Визуалдык редактордун Ыңгайлаштырылган баскычтары

Орнотуу аяктагандан кийин, сол меню тилкесинде тиштүү сөлөкөтү бар Visual Editor Custom Buttons пайда болот ▼

5-кадам: "Жаңы кошуу" баскычын чыкылдатыңыз

• Ыңгайлаштырылган баскычты, каалаган аталышты түзүңүз.
• Мисалы: ички макалаларды кошуу 

▼ орнотуу үчүн төмөнкү сүрөттү ээрчишиңиз керек

6-кадам: Баскычтын мазмунунун параметрлери

• Тандоону тандоо.

7-кадам: Орнотуудан мурун

• Кыска кодду толтуруңуз

8-кадам: Редактордун жөндөөлөрүндө көрсөтүү

• Сиз Visual Editor же Text Editor көрсөтүү баскычтарын текшере аласыз.
• Текст редактору белгиленген болсо, жогорудагы "Кыска жол баскычынын кодун кошууну" өткөрүп жиберсеңиз болот, антпесе ал кайталанат.

9-кадам: Баскыч сүрөтчөсүнүн параметрлери

• Ашылма параметрлер менюсунда Framed сөлөкөтүн тандаңыз.

10-кадам: Тестирлөө

• Акырында, албетте, эффектти өзүңүз сынап көрүү сиздин колуңузда ^_^
• Эгерде жогорудагы кадамдар туура болсо, сиз редактордун визуалдык интерфейсинде төмөндө көрсөтүлгөндөй баскычты көрөсүз ▼