投稿一括入力:Really Simple CSV Importer

注意点

  • csvファイルをUTF-8で保存。excelではムリなのでgooleのスプレッドシートがおすすめ
  • { }で囲まれている列タイトルはオリジナルの文字を指定する。
    {custom_field}列もそのうちのひとつで、自分で作ったカスタムフィールド名(日本語可)を1行目の列タイトルに指定する。
    複数ある場合は、最終列に追加してかける
  • 本文をhtml文にしてもOK
  • 同じ日に複数投稿あるとき、ページ送りの順番が同日内でぐちゃぐちゃになる。 時間指定で解決 → “2017/06/04 11:10”

作者のページかな?:Really Simple CSV Importer 日本語解説&カスタマイズ例
参考URL:記事をCSVで一括投稿
参考URL:いっぱいあるデータをCSVでいっきにWordPressに入れる方法


設定簡単!スライダー:Meta Slider

テーマ「GREEN EYE」とプラグイン「Meteor Slides」の相性が悪いのか
画像がアップロードできず。
メタスライダーはできた。
使い勝手がシンプルだし複数のスライドも作れる。
日本語には対応していないが使い方サイトは日本語充実。

いつものようにプラグインをインストールして有効化。
詳しくは参考文献で!

参考文献:Meta Slider


記事の人気順表示:WordPress Popular Posts

「WordPress Popular Posts」インストール。
日本語対応とかいてあったが日本語にならなかったので
ここから、日本語化ファイルをダウンロードしました。

表示方法は、
ウィジェットからサイドバーに表示させる

参考HP:http://netaone.com/wp/wordpress-popular-posts/

http://netaone.com/wp/wordpress-popular-posts/

今月の人気記事ランキング

  • support service 45ビュー
  • カスタム投稿タイプのアーカイブ表示で抜粋文を出力する 42ビュー
  • Recent Posts Widget Extended:アイキャッチ付新規投稿をウィジェットに追加 29ビュー
  • 天気予報を表示する:WP Weather Hacks 28ビュー
  • 投稿一括入力:Really Simple CSV Importer 24ビュー
  • 投稿記事の評価とランキングができる:WP-PostRatings 21ビュー
  • Purchases 18ビュー
  • link of “SOZAI” 17ビュー
  • link of useful 17ビュー
  • 会員制サイトのプラグイン比較 16ビュー

  • 機能付き表の作成:TablePress=トラブル解決あり

    参考URL:比較表や一覧表を簡単に。テーブル作成用WPプラグイン「TablePress」

    ダウンロードファイル一覧
    ファイル名日付ファイル
    ダウンロード
    詳細
    操作説明書ver.62015.10.092015年10月の新機能「AAA」の操作説明を加えました
    製品A関連の文献2015.10.08
    製品Aの活用例の記載がある文献です
    操作説明書ver.52014.10.01製品のバージョンアップver.2に対応しています
    操作説明書ver.42014.04.10製品Aの操作説明書です。
    操作説明書ver.32013.10.01製品Aの操作説明書です。QandAを加えました。
    操作説明書ver.22013.04.15製品Aの操作説明書です。新機能「XXX」の操作説明が加わりました。
    製品A入門教室2012.10.102012年9月に行われた製品A入門教室で使用したマニュアル本です。
    操作説明書ver.12012.10.01製品Aの操作説明書です。

    ※検索・ソート機能が使えない!
    【解決】footer.php の中に<?php wp_footer(); ?>がなかったので追加。
    tablepressは、フッター部分にスクリプトを追加するため、このコードがないとスクリプトを記述してくれない。
    【他に調べたこと】
    ・jQuerryが読み込まれていない?header.php の<?php wp-head(); ?>でwordpress内のjQuerryが読み込まれる。
    ・他のプラグインとの相性が悪い?jQuerryを利用するプラグインを一時停止して動くか確認。
    ・tablepressを再インストール:カスタマイズしていなかったので意味はないと思ったけど藁をもすがる思いで。

    参考になったページ:WP-Table Relodedで並び替え(ソート)が出来ない場合の対策

    (一言)以前も検索機能が使えなくてwp-footer();をfooter.phpに加えて解決したことがあった。<script>コードは<head>内に記述すると思い込んでしまうが、実はfotterにも記述できるということを忘れないようにしたい。


    投稿記事の評価とランキングができる:WP-PostRatings

    1. プラグインの新規追加で[WP-PostRatings]をインストールして有効化
    2. 管理画面に[☆Ratings]が表示されるのでそこで各種設定を行う
      基本的な設定:[Ratings Options]
      表示する文の設定:[Ratings Templates]
    3. cssを追加する
      追加するクラス:div.hyouka,  .rating,  .rating span
    4. 画像を[image]フォルダに保存する。画像は以下のモノを使う
      rating
    5. WP-PostRationsを貼りつけたいテンプレートファイルに以下のタグを記述する
      投稿ページの場合:single.php
      カスタム投稿ページの場合:single-$posttype.php

      <div class="hyouka">&nbsp;</div>
      

    参考URL:投稿記事の評価ができるプラグイン-wp-postratings

     


    多機能なスライドショー:Skitter Slideshowとカスタマイズ

    とてもいい!
    一種類しか作れないかも。
    それなら、ヘッダー用などに利用するのがベスト

    テーマファイルに記述

    <!--?php if ( function_exists('show_skitter') ) { show_skitter(); } ?-->
    

    ページに記述

    [skitter]/* [ ]は半角になおす */
    

    テーマGreen Eyeでカスタマイズした記録

    GreenEyeのヘッダー画像の大きさに合わせる
    スタイルシート:plugins/wp-skitter-slideshow/css/skitter.style.css

    .box_skitter {
    position: relative;
    # width: 800px;
    # height: 300px;
    width: 930px;
    height: 400px;
    background: #000;
    }
    

    GreenEyeのヘッダーをスライド用にする
    テンプレートファイル:header.php

    <?php /* Slide Goes Here */ ?>
    <div id="iebanner">
    <div id="iebcontent">
    <div id="iefc">
    <center>
    <?php /* if ( function_exists('show_skitter') ) { show_skitter(); } */ ?></center>
    <?php /* class="ibcon" <?php echo of_get_option ( 'slide-image1-title',    ・・・(いらないところはコメントアウト)   get_template_directory_uri() . '/images/slide-image/1.png'); ?> */ ?>
    </div>
    </div>
    </div>
    

    スライドショー用のスタイルシートをインポートする

    @import url(css/style_ie.css);
    

    Skitter Slideshow 設定

    width:930px
    height:400px
    crop-imageはオフ

    参考URL:スライドショー


    写真にフレームを付ける

    画像に写真風のフレームと影を付ける

    Image0027

    html記述部

    <div id="frame-shadow"><img src="***"></div>
    

    css記述部

    #frame-shadow img{
    border:solid 15px white;
    padding:10px;
    -webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
    -moz-box-shadow: 0 10px 8px -6px #8d8c8c;
    box-shadow: 0 10px 8px -6px #8d8c8c;
    }
    

    borderが認識されず、paddingでごまかしてます。
    別のところでは出来ていたけど、why?


    会員制サイトのプラグイン比較

    こんな会員制サイトを作りたく、比較検討してみます。

    1.会員ごとに限定ページのみアクセス可能なサイトを作りたい。
    ※限定ページ以外は閲覧不可にする。

    2.会員数は10~50

    3.閲覧ページは10以上ありページごとにアクセス権をつけていく。
    ※たとえば会員分のカテゴリーを作りカテゴリーでアクセス制限させる。

    Simple-membership
    http://www.webcreatorbox.com/tech/simple-membership/

    WP-members
    http://yogawa.com/post-3251

    Members only
    http://netaone.com/wp/wordpress-members-site-plugin/

    サイト全体の閲覧をログインユーザーのみに限定させることができる。
    閲覧者がログインしていない場合は、指定したページにリダイレクト(転送)できる
    会員ごとのサイトを作りサイトに入る前にログインを要求する

     


    下枠線だけ破線表示の表

    ノートの罫線だけみたいなこんな表です。

    Name Yoshiming
    Address Yokohama-City Japan
    Tel abc-def-2525

    html記述部

    <table id="simply-table">
    <tbody>
    <tr>
    <td id="simply-title">Name</td>
    <td>Yoshiming</td>
    </tr>
    <tr>
    <td id="simply-title">Address</td>
    <td>Yokohama-City Japan</td>
    </tr>
    <tr>
    <td id="simply-title">Tel</td>
    <td>abc-def-2525</td>
    </tr>
    </tbody>
    </table>
    

    css記述部

    #simply-table{
    width:600px;
    border-style:none;
    background-color:transparent;
    line-height : 2;
    }
    #simply-table td{
    padding : 10px 5px;
    border-bottom:1px dashed gray;
    font-size:14px;
    color : black;
    line-height : 2;
    }
    #simply-title{
    padding :10px 5px 10px 30px;
    width:200px;
    font-size:24px;
    text-indent : 10pt;
    }
    

    リンク文字の設定

    リンクの下線を消す
    ※リンクが貼ってあることが分かるように色を変える工夫が必要
    a{
    text-decoration: none;
    }
    未定訪問リンク
    a:link{
    color: #0000ff ;
    }
    訪問済みリンク
    a:visited{
    color: #000080 ;
    }
    ポイント時リンク
    a:hover
    {
    color: #ff0000 ;
    }


    マウスポイント時に行がハイライト表示する表

    スタイルシートでhoverを利用して作成しています。

    #highlight{
    width:600px;
    color : black;
    line-height : 1.3;
    }
    #highlight td{
    padding : 10px 5px;
    background-color : white;
    border:1px solid darkgreen;
    font-size:14px;
    color : black;
    line-height : 1.5;
    }
    #hi-title{
    width:110px;
    font-size:14px;
    text-indent : 10pt;
    }
    #highlight tr:hover td{
    background: darkgreen;
    color: white;
    }
    

    htmlファイルの実装側はこんな感じです。

    <table id="highlight">
    <tbody>
    <tr>
    <td id="hi-title">2の倍数</td>
    <td>1の位が0,2,4,6,8の偶数</td>
    </tr>
    </tbody>
    </table>
    

    見本:こんな感じ


    ヘッダー画像をスライドするプラグイン:Header Image Slider

    〔外観〕→〔ヘッダー〕の画像でスライダーができる

    1枚の画像、もしくは複数の画像をランダム表示させることしか
    出来ないデフォルトの選択画面に、
    Slider項目が増える。
    簡単に使える優れもの!

    『Header Image Slider』をインストールして有効化して使う。

    参考ページ:http://naitoisao.com/1395.html


    フワリと表示されるFAQ:Q & A FAQ and Knowledge Base

    1. プラグイン新規追加で「Q & A FAQ and Knowledge Base」を検索
    2. いつも通りインスールして有効化
    3. 管理メニューにFAQsが表示される
    4. カテゴリー毎にまとめて表示するので、まずは、【FAQ Categories】でカテゴリーを登録する
    5. 新規追加で記事を書く。タイトルをクリックするとふわりと内容が表示される関係にある
    6. FAQsを表示させたい場所に以下のコードを記述する
      [qa cat=”カテゴリーのスラッグ名”]
    7. 表示方法などをカスタマイズしたいときは、[plugins/q-and-a]にスタイルシートファイルがあるのでそこをいじる

    <カスタマイズ>
    ●Posted in: を非表示にした
    【FILE】inc/function.php

    function add_categories_to_single ($content) {
    global $post;
    $faq_cats = qa_add_categories();
    if ( is_single() &amp;&amp; 'qa_faqs' == get_post_type($post) &amp;&amp; !empty( $faq_cats ) ) {
    /* $qa_cats = '
    <p class="qa_cats">' . __('Posted in: ', 'qa-free') . $faq_cats . '';*/
    /* $content = $content . $qa_cats; */
    return $content;
    } else {
    return $content;
    }
    }
    

    ●スタイル変更:answerに背景色を付けた。カテゴリ名とタイトル名の文字の大きさを指定
    【FILE】wp-content/plugin/q-and-a/css/q-a-plus.css

    /* answer box */
    .collapsible .qa-faq-answer {
    display: none;
    background: aliceblue; /* add */
    }
    
    .qa-category h2{
    font-size: 15px;
    }
    .qa-faq-anchor{
    font-size: 15px;
    }
    

    ●個別のテーマのみに反映させたい場合:テーマ内のスタイルシートファイルにコードを記述する
    (ID・クラス名が同じ場合、後から読み込まれた方が上書きしていく。テーマcssの方が後に読み込まれる)
    【FILE】wp-content/themes/palmixio/css/custom.css

    /* plugin q-and-a custom */
    /* size of category and title */
    .qa-category h2{
    font-size: 15px;
    }
    .qa-faq-anchor{
    font-size: 15px;
    }
    /* answer box */
    .collapsible .qa-faq-answer {
    display: none;
    background: aliceblue; /* add */
    }