Redirecting… Click here if you are not redirected.
Redirecting…
Redirecting… Click here if you are not redirected.
jQueryプラグイン「pjax」でスムーズにページ遷移するサイトの作り方 | Neganin(ネガニン)
Warning: "continue" targeting switch is equivalent to "break". Did you mean to use "continue 2"? in /home/users/1/neganin/web/neganin/wp/wp-content/plugins/jetpack/_inc/lib/class.media-summary.php on line 77 Warning: "continue" targeting switch is equivalent to "break". Did you mean to use "continue 2"? in /home/users/1/neganin/web/neganin/wp/wp-content/plugins/jetpack/_inc/lib/class.media-summary
Ajax(pjax)遷移時におけるSNSボタン再構築
Updated 2013.10.04 / Published 2013.10.04 HTML5のhistoryAPI（pushState）とAjaxを組み合わせた遷移（pjax）時に、Twitterのwidgets.jsで埋め込んだツイートボタンが更新されない事態に遭遇しました。pushStateでURLは変更できているにも関わらず、ツイートボタンを押しても取得されるタイトルとURLは最初にツイートボタンを表示したときの遷移前の状態であり、ごっそり入れ替えてもDOMが再構築されていない様子。 TwitterのAPIドキュメントを探すも、Ajax遷移時にDOMを再構築させるような使い方はどこにも載っていない。そこで、検索語を「Tweet button Ajax」に変えてみると、Cannot update tweet button with AJaxという記事がヒット、回答欄に解決策を提示して
pjaxできれいなURL＋非同期画面遷移！ | ヘッドウォータースのブログ TechNote
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね！ これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり！！SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました！！！ これからWebサービスを作るなら、導入したいですね！！！ これpjaxを使えば簡単に導入できるんです！！！よし！！！ PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
AjaxでWordPressのコンテンツを遷移せず表示させる - Show-web
WordPressのコンテンツをtwitterやgoogle画像検索のようにあらかじめ一定数のコンテンツを表示させておき「もっと見る」リンクをクリックで画面遷移無くコンテンツを出力させたいと思います。 INDEX 仕様・デモ WordPressでAjaxを使う /wp-admin/admin-ajax.phpを使う /wp-admin/admin-ajax.phpを使ったデモ 表示用の固定ページ作成 functions.php周り JavaScript登録 全投稿数を取得しクッキーに保存させる 「もっと見る」クリック時のAjax処理登録 課題等 参考サイト 仕様・デモ いくつか課題はありますが、とりあえずの仕様としては以下の通り。 投稿のタイトル及びリンクをあらかじめ一定数表示（今回は10件） 「もっと見る」をクリックする度にAjaxでコンテンツを取得し10件ずつ追加 固定ページ「Ajax
wordpressテーマでjQueryを使って簡易なajaxページ遷移 | てらべのて
wordpressのテーマ内でajaxを使ってのページ遷移は、jQueryの.load()を使うと意外と簡単にできそうです。 $jQuery.load()を使えば、自分のサイト内のページの任意の箇所を非同期通信で読み込んで現在のページの任意の場所に表示させるというアクションが、基本的にはたった一行でできます。すごいですよね。大体こんなかんじです。 $('表示させる箇所のセレクタ').load('サイト内のURL 表示させたい箇所のセレクタ'); で、wordpressのテーマ内でも同様に使えます。 例として、デフォルトのテーマであるtwentytenを使った場合のシングルページでのやり方。 header.phpの内に以下のコードを挿入すれば、シングルページでのページ遷移がajaxでできますが、あくまで簡易版です。 <script type="text/javascript" src="ht
WordPressでAjaxを使う方法の解説 | hijiriworld Web
基本の解説 STEP1. リクエスト送信先のパス WordPress で Ajax を使う場合 /wp-admin/admin-ajax.php にリクエストを送ることに決まっている。 JavaScript ファイル内で動的にパスを指定することはできないので、wp_head にフックしてリクエスト送信先のURLをグローバル変数として出力しておく。 > functions.php function add_my_ajaxurl() { ?> <script> var ajaxurl = '<?php echo admin_url( 'admin-ajax.php'); ?>'; </script> <?php } add_action( 'wp_head', 'add_my_ajaxurl', 1 ); wp_head アクションにフックすることで head 要素内に JavaScript
WordPress ページングはやめてAjaxローディングにする | hijiriworld Web
ページングはやめて、Ajaxによる非同期ローディングにしてみましょう。 最初は5件の記事が表示されています。 「もっと見る」ボタンをクリックするとAjaxにより次の5件が非同期で読み込まれます。 以後、記事がなくなるまで同じ動作です。 テンプレート <section id="content"> <?php query_posts('posts_per_page=5'); ?> <?php if (have_posts()) : ?> <?php while (have_posts()) : the_post(); ?> <article> <h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2> <div class="excerpt"><?php the_excerpt(); ?></div> </arti
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://webkatu.com/pushstate-ajax/