ヘッダーの下に独自の相互RSSを設置したい

Simplicityの特徴 フォーラム テーマファイルのカスタマイズに関する質問など ヘッダーの下に独自の相互RSSを設置したい

このトピックには12件の返信が含まれ、1人の参加者がいます。2 年、 4 ヶ月前 ペンギン さんが最後の更新を行いました。

  • 投稿者
    投稿
  • #50999 返信

    ペンギン

    はじめまして。

    ヘッダーの下に相互RSSを設置したいです。

    simplicityのヘッダーの下に相互RSSを設置する為に、こちらのサイトを参考にやってみたのですが上手くいきません。
    http://oxynotes.com/?p=7379#comment-332452

    http://oxynotes.com/?p=10115

    最終的にはヘッダーの下に2列で表示させたいです。

    現在はLivedoor相互RSSを使っていますが、広告が出てくるので新しく相互RSSを作りたいです。

    どこをいじればいいのか知識がないのでわかりません。先生、教えてください。

    私のサイトです
    http://niichan-newsreport1016.xyz/

  • #51001 返信

    Hidekichi

    そんなもん使わなくてもメチャクチャ簡単にできますよ。

    子テーマfunctions.phpに、

    register_sidebar(array(
         'name' => 'top_left' ,
         'id' => 'top_left' ,
         'before_widget' => '<div class="widget">',
         'after_widget' => '</div>',
         'before_title' => '<h3>',
         'after_title' => '</h3>'
    ));
    register_sidebar(array(
         'name' => 'top_right' ,
         'id' => 'top_right' ,
         'before_widget' => '<div class="widget">',
         'after_widget' => '</div>',
         'before_title' => '<h3>',
         'after_title' => '</h3>'
    ));

    こうしておいてウィジェットエリアを登録しておきます。
    子テーマbefore-main.phpに、

    <div class="top rss">
        <div class="left"><?php dynamic_sidebar('top_left'); ?></div>
        <div class="right"><?php dynamic_sidebar('top_right'); ?></div>
    </div>

    ※ 最初のphp閉じタグ後に入れて下さい。

    で、ダッシュボード→ウィジェットから作ったウィジェットエリアにRSSウィジェット貼り付けて対象のfeedアドレスを入れるだけです。

    後は、スタイルするだけです。

    .top.rss .left, .top.rss .right {
        display: inline-block;
        width: calc((100% - 80px)/2);
        vertical-align: top;
        margin: 10px;
    }
    .top.rss ul {
        list-style: none;
    }
    .top.rss li {
        margin-bottom: 10px;
        line-height: 1.3;
    }
    .top.rss li:last-of-type {
        margin-bottom: 0;
    }

    とか。まぁスタイルはお好きにどうぞ。

  • #51002 返信

    けいと

    すごい!
    こんなに簡単にできるんですね!
    僕も独自の相互RSS設置を考えてたので、助かります!
    Simplicity2のカスタマイズ性には驚きです!
    オタク速報さんを始め、多くの大手ワードプレスサイトが使われる理由がよくわかります!!

    できたら簡単なNGワードフィルタ機能を搭載したいと考えてるのですが、
    それは流石に難易度が高いでしょうか?

  • #51003 返信

    Hidekichi

    > 簡単なNGワードフィルタ機能を搭載したいと考えてるのですが、
    > それは流石に難易度が高いでしょうか?

    rssを20件ぐらい取得して、NGワードのものをjQueryとcssで非表示にして先頭から5件を表示とかならできるかも。NGワードだらけだと全部非表示になったりの可能性はありますけどね(笑)

  • #51005 返信

    けいと

    >rssを20件ぐらい取得して、NGワードのものをjQueryとcssで非表示にして先頭から5件を表示とかならできるかも。

    なるほど!その発想はなかったです!やってみます!!
    ありがとうございます!!

  • #51274 返信

    ペンギン

    Hidekichi様

    お礼が遅れてしまい、大変申し訳ありませんでした。
    おかげさまで、自分の思い通りの相互RSSを作成することができました!

    例えばですが、RSSのリンクを新しいタブで表示させることは出来ますか??

    RSSの左側は自分の更新情報なのでそのタブで開き、右側のRSSは外部なので新しいタブで開くみたいな器用なことって出来ますか??

  • #51276 返信

    Hidekichi

    rssのウィジェットは、.rsswidgetというクラスがついているので、

    (function($){
      $(function($){
        $(".rsswidget").attr("target", "_blank");
      })
    })(jQuery);

    でイケるんじゃないでしょうか?
    部分的に有効にするのであれば、
    $("任意のセレクタ").find(".rsswidget").attr("target", "_blank");
    とすればいけるかと思います。条件をつければPcの時だけとか色々できるかと思います。

  • #51394 返信

    ペンギン

    Hidekichi様

    ありがとうございます。

    教えて頂いた通りに記入してみたのですが、同じタブで開いてしまいます。

    子テーマのjavascript.jsで動かすのですよね?

  • #51396 返信

    Hidekichi

    > 子テーマのjavascript.jsで動かすのですよね?

    その通りです。

    重要なのは、どんなセレクタがリンクについているかだけです。
    多分共通だと思うんですけどね。

    他でjavascriptに何かしらエラーが出ていたら動かないかも知れません。
    デベロッパーツールでコンソールを見て確認して下さい。

  • #51438 返信

    ペンギン

    Hidekichi様

    Google Chromeのデベロッパーツールで確認してみたところ赤い文字でエラーが出ていました。

    Uncaught public-api.wordpress.com/wp-admin/rest-proxy/#https://widgets.wp.com:1
    SyntaxError: Unexpected token m in JSON at position 0
    at JSON.parse (<anonymous>)
    at receiveMessage (public-api.wordpress.com/:113)
    at public-api.wordpress.com/:250
    at dispatch (s0.wp.com/:3)
    at r.handle (s0.wp.com/:3)

    これが原因でしょうか?

  • #51439 返信

    Hidekichi

    たぶんそれですね。
    wordpress.comに接続するようなのはjetpackかrest.apiですけども、どのモジュールが原因かはレスの内容だけだとわかりません。また他のプラグインも考えられます。
    デベロッパーツールのnetworkあたりで403とかそのあたりから見当を付けて探すか、ひとまずそれらしいモジュールを停止して確認するか、アップデートがされていないならしてみるとか、色々試す必要があります。

  • #51463 返信

    ペンギン

    Hidekichi様

    エラーを調べてみても全くわからず困っていたところ、このページにたどり着き自己解決しました!

    「jQuery以外のライブラリと競合している」という項目を見てピンときたので弄ってみたところ、ちゃんとjqueryが動きました。デベロッパーツールのエラー内容との関連性は理解できませんでしたが、動いたので良かったです。

    本当にありがとうございます!

  • #51464 返信

    ペンギン

    ページがちゃんと表示されてませんでした(汗)

    http://lifequest-blog.com/webcreation/javascript/367/

返信先: ヘッダーの下に独自の相互RSSを設置したい
あなたの情報:




スポンサーリンク
アドセンス(大)
アドセンス(大)