質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.12%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

スクロール

スクロールとは、ディスプレイスクリーン上において連続的にコンテンツが滑っていくことを指します。

プラグイン

プラグイン(plug-in)は、ソフトウェアアプリケーションの機能拡張の為に開発された、一組のソフトウェアコンポーネントのことを指します。

解決済

WordPressのテーマ:HuemanでInfinite-Scrollを適用したい

hikaru923
hikaru923

総合スコア27

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

スクロール

スクロールとは、ディスプレイスクリーン上において連続的にコンテンツが滑っていくことを指します。

プラグイン

プラグイン(plug-in)は、ソフトウェアアプリケーションの機能拡張の為に開発された、一組のソフトウェアコンポーネントのことを指します。

1回答

0リアクション

0クリップ

2046閲覧

投稿2017/06/07 11:39

編集2017/06/08 06:10

###前提・実現したいこと
WordPressのHuemanテーマを用いて
ブログのようなものを作ろうと考えています。
結構記事を溜めるつもりなので
Twitterみたいに、下にスクロールすると次の記事が表示されるようにしたいと思っています。

###発生している問題・エラーメッセージ
このInfinite-Scroll
というプラグインで無限スクロールを実現しようと思ったのですが
プラグインをONにしても無限スクロールになりません…
どうもセレクタを指定しなければならないとの事ですが
イメージ説明
「Next Selector」の書き方が分かりません…
そもそも他の三つも合っているのか不明でして…

###該当ソースコード

PHP

<body class="post-template-default single single-post postid-147 single-format-standard logged-in admin-bar no-customize-support col-2cl boxed topbar-enabled header-desktop-sticky header-mobile-sticky chrome"> <div id="wrapper"> //header部分 <div class="container" id="page"> <div class="container-inner"> <div class="main"> <div class="main-inner group"> <section class="content"> <div class="page-title pad group"> <!--パンくず--> <div class="breadcrumbs"> <!-- Breadcrumb NavXT 5.7.0 --> <span property="itemListElement" typeof="ListItem"><a property="item" typeof="WebPage" title="テストサイトへ移動" href=""><span property="name">テストサイト</span></a><meta property="position" content="1"></span> &gt; <span property="itemListElement" class="taxonomy category" data-wpel-link="internal"><span property="name">ニュース</span></a><meta property="position" content="2"></span> &gt; <span property="itemListElement" typeof="ListItem"><a property="item" typeof="WebPage" title="今日のニュースのカテゴリーアーカイブへ移動" href=""><span property="name">今日のニュース</span></a><meta property="position" content="3"></span> &gt; <span property="itemListElement" typeof="ListItem"><span property="name">[67] 今日のニュース [ニュース&話題]</span><meta property="position" content="4"></span> </div> </div><!--/.page-title--> <div class="pad group"> <article class="post-147 post type-post status-publish format-standard has-post-thumbnail hentry category-recommend category-9"> <div class="post-inner group"> <h1 class="post-title entry-title">[67] 今日のニュース [ニュース&話題]</h1> <p class="post-byline">by <span class="vcard author"> <span class="fn"><a href="">ヒカル</a></span> </span> &middot; 公開 <time class="published" datetime="2017年6月7日">201767</time> </p> <div class="clear"></div> <div class="entry themeform"> <div class="entry-inner"> 記事本文 <!-- AddThis Sharing Buttons below --> <nav class="pagination group"> </nav><!--/.pagination--> </div> <div class="clear"></div> </div><!--/.entry--> </div><!--/.post-inner--> </article><!--/.post--> <div class="clear"></div> <ul class="post-nav group"> <li class="next"></li> <li class="previous"><a href="http://testtest.jp/archives/news_170606/" rel="prev" data-wpel-link="internal"><i class="fa fa-chevron-left"></i><strong>前の記事</strong> <span>[66] 今日のニュース [ニュース&話題]</span></a></li> </ul> <h4 class="heading"> <i class="fa fa-hand-o-right"></i>あわせて読みたい</h4> <ul class="related-posts group"> <li class="related post-hover"> <article class="post-107 post type-post status-publish format-standard has-post-thumbnail hentry category-recommend category-7"> <div class="post-thumbnail"> <a href=""> <img width="520" height="245" src="" class="attachment-thumb-medium size-thumb-medium wp-post-image" alt="" srcset="";"/></a> </div><!--/.post-thumbnail--> <div class="related-inner"> <h4 class="post-title entry-title"> <a href="">テストサイトについて</a> </h4><!--/.post-title--> <div class="post-meta group"> <p class="post-date"> <time class="published updated" datetime="2017-06-01 12:00:14">2017年6月1日</time> </p> <p class="post-byline" style="display:none">&nbsp;by <span class="vcard author"> <span class="fn"><a href="">ヒカル</a></span> </span> &middot; Published <span class="published">2017年6月1日</span> &middot; Last modified <span class="updated">2017年6月6日</span> </p> </div><!--/.post-meta--> </div><!--/.related-inner--> </article> </li><!--/.related--> <li class="related post-hover"> <article class="post-118 post type-post status-publish format-standard has-post-thumbnail hentry category-recommend category-9"> <div class="post-thumbnail"> <a href=""> <img width="520" height="245" src="" class="attachment-thumb-medium size-thumb-medium wp-post-image" alt="" srcset="" ;"/></a> </div><!--/.post-thumbnail--> <div class="related-inner"> <h4 class="post-title entry-title"> <a href="">[66] 今日のニュース [ニュース&話題]</a> </h4><!--/.post-title--> <div class="post-meta group"> <p class="post-date"> <time class="published updated" datetime="2017-06-06 12:00:30">201766</time> </p> <p class="post-byline" style="display:none">&nbsp;by <span class="vcard author"> <span class="fn"><a href="">ヒカル</a></span> </span> &middot; Published <span class="published">201766</span> &middot; Last modified <span class="updated">201767</span> </p> </div><!--/.post-meta--> </div><!--/.related-inner--> </article> </li><!--/.related--> </ul><!--/.post-related--> <section id="comments" class="themeform"> <!-- comments closed, no comments --> </section><!--/#comments--> </div><!--/.pad--> </section><!--/.content--> <div class="sidebar s1 collapsed" data-position="right" data-layout="col-2cl" data-sb-id="s1"> <a class="sidebar-toggle" title="サイドバーを展開" data-wpel-link="internal"><i class="fa icon-sidebar-toggle"></i></a> <div class="sidebar-content"> <div class="sidebar-top group"> <p style="text-transform:none;font-size: 0.8em;">カスタマイザーからここにソーシャルリンクを設定できます。. <a style="color: white;text-decoration:underline;" href="http://testtest.jp/wp-admin/customize.php?autofocus[section]=social_links_sec" title="カスタマイズする" data-wpel-link="internal">カスタマイズする &raquo;</a></p> </div> <div id="categories-2" class="widget widget_categories"><h3 class="widget-title">カテゴリー</h3> <ul> <li class="cat-item cat-item-6"><a href="">recommend</a> </li> <li class="cat-item cat-item-7"><a href="">テストサイト</a> </li> <li class="cat-item cat-item-9"><a href="">今日のニュース</a> </li> </ul> </div><div id="search-2" class="widget widget_search"><h3 class="widget-title">キーワードを検索</h3><form method="get" class="searchform themeform" action="http://testtest.jp/"> <div> <input type="text" class="search" name="s" onblur="if(this.value=='')this.value='検索するには入力して Enter';" onfocus="if(this.value=='検索するには入力して Enter')this.value='';" value="検索するには入力して Enter"/> </div> </form></div> </div><!--/.sidebar-content--> </div><!--/.sidebar--> </div><!--/.main-inner--> </div><!--/.main--> </div><!--/.container-inner--> </div><!--/.container--> //フッター部分 </div><!--/#wrapper-->

エラーは発生しておりません。

###謝辞
問題解決にあたり、何か必要な情報などありましたら遠慮なくお申し付けください。随時追加させていただきます!
わざわざ目を通していただき誠にありがとうございました。
何卒、お力添えをよろしくお願い申し上げます。
イメージ説明

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

m.ts10806

2017/06/07 11:54

現状書かれているソースコードはつけてください。あと、デベロッパーツール等でエラーがはかれていたら、それも。
hikaru923

2017/06/08 03:42

追記させていただきました。大変申し訳ございません。実際に動いてるサイトのどの情報を載せればいいか+特定されないようにどの部分を変更すればいいのか分からず…ご指摘ありがとうございます!

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.12%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

スクロール

スクロールとは、ディスプレイスクリーン上において連続的にコンテンツが滑っていくことを指します。

プラグイン

プラグイン(plug-in)は、ソフトウェアアプリケーションの機能拡張の為に開発された、一組のソフトウェアコンポーネントのことを指します。