サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
WWDC25
kyasper.com
<?php //全投稿数を取得 //post_typeの値に投稿名を記述 //投稿数の場合：post、カスタム投稿の場合：カスタム投稿名 $numposts = $wpdb->get_var("SELECT count(*) FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post'"); if (0 < $numposts) $numposts = number_format($numposts);//全投稿数 echo '<p>全投稿数：'. $numposts .'</p>'; ?>
WordPressでBootstrap(v2.3.2)に対応したページネーションを実装してみます。なお、１ページ目の「Prev（«）」と最終ページの「Next（»）」は出力しない仕様です。 Bootstrap ver2.3.2 Pagenation http://getbootstrap.com/2.3.2/components.html#pagination functions.php //Pagenation function pagination($pages = '', $range = 2) { $showitems = ($range * 2)+1;//表示するページ数（５ページを表示） global $paged;//現在のページ値 if(empty($paged)) $paged = 1;//デフォルトのページ if($pages == '') { global $wp_q
ご指定された単一記事を表示しています。 2013年7月14日 タグ：tutorial WordPress カテゴリー一覧表示で、投稿数もリンクタグ内に出力する
任意のボックス要素を画面の高さと同じにします。 ＊ボックス要素の高さが画面サイズより大きい場合は、そのまま何もしません。 $(document).ready(function(){ //画面の高さを取得して、変数wHに代入 var wH = $(window).height(); //div#exampleの高さを取得を取得して、変数divHに代入 var divH = $('div#example').innerHeight(); // ボックス要素より画面サイズが大きければ実行 if(wH > divH){ // div#examplに高さを加える $('div#example').css('height',wH+'px'); } }); 補足 innerHeight は、ボックスのpaddignを含めた高さを取得するメソッドです。 ＊類似したメソッド height 要素のpaddin
WordPressのページネーションをプラグインなし、シンプルなデザインで実装してみます。 Screen shot 参考：出力されるコード <div class="pagenation"> <ul> <li class="prev"><a href="....">Prev</a></li> <li><a href="....">1</a></li> <li><a href="....">2</a></li> <li><a href="....">3</a></li> <li class="active">4</li> <li><a href="....">5</a></li> <li class="next"><a href="....">Next</a></li> </ul> </div>
WordPressサイトで、外部のサイトからRSSフィードを受け取って、その外部サイトの新着情報などを表示する方法をご紹介します。 DEMO <h4> <a href="http://commune.web-creator-world.com/">Web Create Commune 新着情報</a> </h4> <ul> <li> <span class="date">2013.07.15</span> <br> <a href="http://commune.web-creator-world.com/?p=186"> <span class="title">第４回〜 第９回　WordPress勉強会 vol1　まとめ</span> </a> </li> <li> <span class="date">2013.07.15</span> <br> <a hr
WordPressのウィジェット「最近の投稿」には投稿日を表示するオプションがありますが、投稿日が表示されるのは投稿タイトルの後ろになります。 これを「投稿日」「投稿タイトル」の順で表示させ、かつ投稿日もリンクタグに含まれようにカスタマイズしてみます。 以下のコードをfunctions.phpに記述します。 code class My_WP_Widget_Recent_Posts extends WP_Widget_Recent_Posts { function My_WP_Widget_Recent_Posts() { parent::WP_Widget(false, $name = 'ウィジェット名'); } function widget($args, $instance) { $cache = wp_cache_get('widget_recent_posts', 'widget'
jQueryを使って、マウスオーバーするとパネルがニューッと出てくる方法をご紹介します。 表示スペースを有効に使いたいときや、ちょっとしたサイトアクセントにいいかもしれません。 INDEX バネル全体がニューッと出てくるタイプ 各メニューがニューッと出てくるタイプ 補足：パネル全体がニューッと出てくるタイプ（右から） 基本的な作り方は同じで、違うのはCSSだけです。 バネル全体がニューッと出てくるタイプ ▶ DEMO 1 jQuery読み込み ＊<head>〜</head>の間に以下のソースを記述 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> JavaScript ＊<head>〜</head>の間に以下のソースを記
ページ内リンクでスムーズにスクロール移動させる方法の紹介です。 とても簡単に実装できます。 スムーズスクロール？というかたは、↓の DEMO をご覧になって、どこかリンク部分（下線がある文字）をクリッックしてください。ページ内でリンクが貼ってある場所へスムーズにスクロールするはずです。 ＊味も素っ気もない DEMO ですが、余計な装飾をすると、ソース説明や理解に余計なものがはいるのであえてそうしています。 ▶ DEMO INDEX 手順１：jQueryの記述 手順２：HTMLの記述 WordPressの場合 サンプルソース 補足 位置調整 ページ間でのスムーススクロール 手順１：jQueryの記述 まず、 <head>〜</head> の間に以下のソースを記述してください。 <!-- jQuery.jsの読み込み --> <script type="text/javascript" src
レスポンシブで簡単に複数設置できるWordPress スライダープラグイン WordPress Slider Plugin レスポンシブなスライダー WordPress Slider Plugin の導入手順をご紹介します。 このスライダープラグインは、余計な装飾がなくて、設置も簡単。 しかも複数設置・テキスト挿入ができるので気に入っています。 おもな特徴と機能 レスポンシブ対応 高さ・幅のレスポンシブ／固定の選択可 キャプションの挿入ができる 複数設置ができる アニメーションは、スライド・フェードの２種類 スライドの自動／手動の選択可 スライド方向、縦／横の選択可 アニメーション間隔・動作スピードの設定 以下のナビゲーションのON/OFF Pagenation Previous/Next Kysbord navigation Touch swipe Linkable Pause on h
function.phpに以下のコードを記します。 ＊すでにカスタム投稿機能を追加済みの場合は、13行目以降を追加してください。 //カスタム投稿の追加と、カテゴリー、タグ機能の追加 function my_custom_init() { //カスタム投稿「example」の設定 register_post_type( 'example', array( 'label' => 'example の投稿', 'public' => true, 'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'custom-fields' ,'comments' ), 'menu_position' => 5, 'has_archive' => true )); //カテゴリタイプの設定（カスタムタクソノミーの
ホームページの運営支援 効果のあるホームページ運営をお手伝いします。 ▶ ホームページは作ってからがスタート！ ソーシャルネットワーク連携 ユーザーとの結びつきにかかせないTwitterやFacebookの活用。 ▶ ホームページの"集客力"を高めるSNS連携 ホームページ＋ショップカート 自社製品を販売したいが、ECサイトを構えるほどでは・・・という場合は、自社ホームページ内で販売。 ▶ 小規模販売は、ホームページ+ショッピングカート レスポンシブなホームページ タブレットやスマートフォンにも対応したホームページの必要性が高まっています。一つのホームページで費用削減。 ▶ レスポンシブデザインによる、モバイル対応 モバイル専用サイト モバイルユーザーにターゲットを絞った魅力のある専用サイトを制作。 ▶ タブレット・スマートフォンならではの表現力のあるWEBサイトを制作します
このページを最初にブックマークしてみませんか？
『Kyasper Web Design』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
