Wie implementiert man eine Reader Wall in WordPress?
Das Beispiel in diesem Artikel beschreibt, wie WordPress eine Reader Wall implementiert. Teilen Sie es als Referenz mit allen. Die spezifische Implementierungsmethode ist wie folgt:
Empfohlen: „WordPress-Tutorial“
1 Kopieren Sie die Seite PAGE.php und benennen Sie sie um readwall.php, und fügen Sie dann oben den folgenden Code hinzu:
Der Code lautet wie folgt:
<?php /* Template Name: Reader wall */ ?>
Tipp: Sie können einen Teil des Codes ändern, bevor Sie ihn ausführen.
2. Fügen Sie den folgenden Code an der Stelle hinzu, an der Sie eine Lesewand hinzufügen müssen:
Der Code lautet wie folgt:
<!-- start 读者墙 Edited By iSayme--> <?php $query="SELECT COUNT(comment_ID) AS cnt, comment_author, comment_author_url, comment_author_email FROM (SELECT * FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->posts.ID=$wpdb->comments.comment_post_ID) WHERE comment_date > date_sub( NOW(), INTERVAL 24 MONTH ) AND user_id='0' AND comment_author_email != '改成你的邮箱账号' AND post_password='' AND comment_approved='1' AND comment_type='') AS tempcmt GROUP BY comment_author_email ORDER BY cnt DESC LIMIT 39";// ?>
Alle, ändern Sie die E-Mail-Adresse des Administrators in Ihre Der letzte ist 39. Wie viele Avatare werden ausgewählt? Sie können ihn entsprechend Ihrem eigenen Thema an die Themenbreite anpassen. Der Code lautet wie folgt:
<?php $wall = $wpdb->get_results($query); $maxNum = $wall[0]->cnt; foreach ($wall as $comment) { $width = round(40 / ($maxNum / $comment->cnt),2);//此处是对应的血条的宽度 if( $comment->comment_author_url ) $url = $comment->comment_author_url; else $url="#"; $avatar = get_avatar( $comment->comment_author_email, $size = '36', $default = get_bloginfo('wpurl').'/avatar/default.jpg' ); $tmp = "<li><a target="_blank" href="".$comment->comment_author_url."">".$avatar."<em>".$comment->comment_author."</em> <strong>+".$comment->cnt."</strong></br>".$comment->comment_author_url."</a></li>"; $output .= $tmp; } $output = "<ul class="readers-list">".$output."</ul>"; echo $output ; ?> <!-- end 读者墙 -->
Tipp: Sie können einen Teil des Codes ändern, bevor Sie ihn ausführen.
3. Fügen Sie den folgenden Stil zu style.css im Theme-Verzeichnis hinzu:
Der Code lautet wie folgt:
.readers-list{line-height:18px;text-align:left;overflow:hidden;_zoom:1} .readers-list li{width:200px;float:left;*margin-right:-1px} .readers-list a,.readers-list a:hover strong{background-color:#f2f2f2;background-image:-webkit-linear-gradient(#f8f8f8,#f2f2f2);background-image:-moz-linear-gradient(#f8f8f8,#f2f2f2);background-image:linear-gradient(#f8f8f8,#f2f2f2)} .readers-list a{position:relative;display:block;height:36px;margin:4px;padding:4px 4px 4px 44px;color:#999;overflow:hidden;border:#ccc 1px solid;border-radius:2px;box-shadow:#eee 0 0 2px} .readers-list img,.readers-list em,.readers-list strong{-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;transition:all .2s ease-out} .readers-list img{width:36px;height:36px;float:left;margin:0 8px 0 -40px;border-radius:2px} .readers-list em{color:#666;font-style:normal;margin-right:10px} .readers-list strong{color:#ddd;width:40px;text-align:right;position:absolute;right:6px;top:4px;font:bold 14px/16px microsoft yahei} .readers-list a:hover{border-color:#bbb;box-shadow:#ccc 0 0 2px;background-color:#fff;background-image:none} .readers-list a:hover img{opacity:.6;margin-left:0} .readers-list a:hover em{color:#EE8B17;font:bold 12px/36px microsoft yahei} .readers-list a:hover strong{color:#EE8B17;right:150px;top:0;text-align:center;border-right:#ccc 1px solid;height:44px;line-height:40px}
Tipp: Sie können einen Teil des Codes vorher ändern Ausführen.
Ich hoffe, dass die Beschreibung in diesem Artikel für alle beim Erstellen einer WordPress-Website hilfreich sein wird.
Das obige ist der detaillierte Inhalt vonSo implementieren Sie die Reader Wall in WordPress. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!