「メイド・イン・ヘブン」スキン適用中

Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

Cocoon 設定の変更を保存後元のタ...
 
共有:
通知
すべてクリア

[解決済] Cocoon 設定の変更を保存後元のタブに戻す

23 投稿
5 ユーザー
11 Likes
471 表示
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

 お世話になっております。
 Cocoon を使用して Web サイトを構築しています。

 一般的なプラグインでは設定を保存すると元のタブが表示される仕組みですが、Cocoon でもそのような変更は可能でしょうか?

 ただ、元のタブに戻るニーズが少ないようであれば、現状のままでも大丈夫です。

 Cocoon 設定を保存後プレビューを確認することがありますが、そのときにクリック操作が必要だからです。

現状の動作例 Cocoon 設定で「コード」タブをクリックし、変更を保存。その後「スキン」タブに遷移します。コードタブに移動する場合は再度タブを選択する必要があります。

 
 タブ型設定画面が搭載されているプラグインなどでは、元のタブに戻ることも多いようなので、それらも含めて考慮いただければありがたいです。

 

 なお、意図的にそのような仕様にされている場合もそのままでも大丈夫です。

 よろしくお願いいたします。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
わいひら reacted
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

補足します。

現状の動作例は Cocoon 設定で「コード」タブをクリックし、変更を保存。その後「スキン」タブに遷移します。コードタブに移動する場合は再度タブを選択する必要がありますが、希望している動作は、コードタブを例とするなら「Cocoon 設定で「コード」タブをクリックし、変更を保存。もともといたコードタブの設定が表示されます」となります。

WP Mail SMTP や wpForo、などのプラグインでは、タブ型の設定画面を採用していますが、その設定画面のように変更を保存後保存したオプションのページが再度表示されます。

このような仕様が便利かなと個人的には思っております。

よろしくお願いいたします。

This post was modified 9か月前 by KonpeitoRO

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
わいひら reacted
chu-ya
(@chu-ya)
Famed Member Registered
結合: 2年前
投稿: 2263
 

●ご参考

お試しに作ってみました。
尚、前回のタブ保存にCookieを用いています。

add_action('admin_footer', function() {
  echo <<<EOF
<script>
(function($) {

  // Cookieから任意のキーの値取得
  function getCookie(key) {
    var cookies = document.cookie;
    var cookiesArray = cookies.split(';');
    for (var tuple of cookiesArray){
      var strArray = tuple.split('=');
      var str = strArray[0];
      if (str.trim() == key) {
        str = strArray[1];
        return str.trim();
      }
    }
    return '';
  }


  // Cookieから前回のidを取得し、タブをオン
  const tab = getCookie('my-tab')
  if (tab) {
    $('#' + tab).prop("checked", true);
  }

  // タブをクリックしたらCookieにidを保存
  $('#tabs .tab-input').click(function() {
    id = $(this).attr("id");
    document.cookie = "my-tab=" +  id;
  });
})(jQuery);
</script>
EOF;
});

   
わいひら reacted
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

@chu-ya さん

コードの提供ありがとうございます。

ご提示くださったコードを子テーマの functions.php にペーストし、アップロードすると無事元のタブに戻ってきます。

Cocoon 設定を保存後は一瞬「スキン」タブが選択され、続いて保存直前のタブに戻ります。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
わいひら reacted
chu-ya
(@chu-ya)
Famed Member Registered
結合: 2年前
投稿: 2263
 

投稿者:: @konpeitoro

Cocoon 設定を保存後は一瞬「スキン」タブが選択され、続いて保存直前のタブに戻ります。

Cocoon設定画面が表示されたあと、JSが動き、タブが切り替わります。
この為、タブのチラツキが発生します。

あくまで、お試し参考なのでご了承下さい。


   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 6年前
投稿: 16481
 

昨夜超絶簡素なものを作成してみました。
昨日作ったのは以下のような仕様です。

・現在開いているタブで保存すると次はそのタブが開いて表示される
・メニューからCocoon設定を開けばデフォルトの「スキン」タブが表示
・ポストの値を利用するのでクッキーは使用せず(どっちを使おうか迷ったけど)
・なるべく速度重視でタブと設定内容が全て表示された時点でタブ選択(一番早いのはPHPで書くことだけどそこまではしてません)

僕もお試し版でGitHubにアップしておきました。
よろしければ試してみていただければ幸いです。
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------


   
chu-ya
(@chu-ya)
Famed Member Registered
結合: 2年前
投稿: 2263
 

私の場合、Cocoon設定を、再表示した際、前回のタブが開きます。

わいひらさんの、作成した動作を確認しました。
一旦、Cocoon設定から離れ、再表示の際、初期表示(「スキン」タブ)の方が、シンプルで分かり易いですね。


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

@yhira さん

早速のアップデートありがとうございます。

私も試しました。

Cocoon 設定で変更を保存するとちらつきが発生します。

また、@chu-ya さんのおっしゃるように Cocoon 設定を閉じ再表示したい場合は「スキン」タブ表示が良いと思います。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 3年前
投稿: 6933
 

KonpeitoROさん

恐れ入りますが、少し確認させてください。

投稿者:: @konpeitoro

Cocoon 設定を閉じ再表示したい場合は「スキン」タブ表示が良いと思います。

上記についてですが。

  • 現状仕様に対する同意
  • そうなっていないという指摘

どちらでしょうか。

 

わいひらさん、ご提示の仕様は以下。

投稿者:: @yhira

・現在開いているタブで保存すると次はそのタブが開いて表示される
・メニューからCocoon設定を開けばデフォルトの「スキン」タブが表示
・ポストの値を利用するのでクッキーは使用せず(どっちを使おうか迷ったけど)
・なるべく速度重視でタブと設定内容が全て表示された時点でタブ選択(一番早いのはPHPで書くことだけどそこまではしてません)


   
わいひら reacted
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 3年前
投稿: 6933
 

私の環境での動作イメージです。
(GIFが不鮮明ですので、タブは見づらいです)


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

@mk2_mk2 さん

 

下記のように変更されたとのことですが、Cocoon バージョン: 2.6.3.8 にアップデート後、Cocoon 設定を閉じ再表示したい場合は「スキン」タブ表示になっていないということです(アップデート後の仕様に対する意見)。

 

投稿者:: @yhira

・現在開いているタブで保存すると次はそのタブが開いて表示される
・メニューからCocoon設定を開けばデフォルトの「スキン」タブが表示
・ポストの値を利用するのでクッキーは使用せず(どっちを使おうか迷ったけど)
・なるべく速度重視でタブと設定内容が全て表示された時点でタブ選択(一番早いのはPHPで書くことだけどそこまではしてません)

 

開発版へのアップデート前は、Cocoon 設定を閉じ再度開くと「スキン」タブが表示されていました(変更保存後も同様)。

Cocoon 設定を離れて再度開いた場合の表示は開発版アップデート前の仕様が良かったと思います。

私が希望している仕様は、以下のようになります。

  1. Cocoon 設定の変更を保存後、保存直前にいたタブが表示される
  2. Cocoon 設定を離れ再度アクセスした場合は、「スキン」タブが表示される。

説明がわかりにくく申し訳ありません。

ご検討いただけますと幸いです。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 3年前
投稿: 6933
 

KonpeitoROさん

先の返信に、私の環境での動作イメージを添付しました。

投稿者:: @konpeitoro

  1. Cocoon 設定の変更を保存後、保存直前にいたタブが表示される
  2. Cocoon 設定を離れ再度アクセスした場合は、「スキン」タブが表示される。

私の環境では、上記のようになっているかと思います。

 

先の対応での、functions.phpの記載は、削除済ということですよね。

そうだとすると、他に問題があるかもしれないです。

 

私の動作イメージで、足りない・こういう操作をして欲しいなどあれば、やってみます。
(すみません、そろそろ時間がありませんので、午後(夕方)以降になってしまうと思いますが、書き込んでいただければ、後程やってみます)

もしくは認識違いがあれば、ご指摘いただければと思います。


   
KonpeitoRO reacted
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

投稿者:: @mk2_mk2

先の対応での、functions.phpの記載は、削除済ということですよね。

 

申し訳ありません。私のミスでした。functions.php の記述をそのままにしてしまっていたので、削除すると希望していた仕様になりました。

ただ、「スキン」タブが選択されたあと、一瞬で保存前にいたタブに戻るのが少し気になります。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 3年前
投稿: 6933
 

KonpeitoROさん

投稿者:: @konpeitoro

「スキン」タブが選択されたあと、一瞬で保存前にいたタブに戻るのが少し気になります。

これは、具体的にどんな操作をすれば良いでしょう。

箇条書きなどで、ご指示いただければ、やってみます。
(ちょっと時間がギリギリ・・・)

 

例)

  1. 「投稿」ダブを選択
  2. 「カテゴリー・ダク表示」を変更
  3. 変更をまとめて保存
  4. 「スキン」タブを選択

 

【追記】

すみません、記載しておいていただければ、遅くなるとは思いますが、後程やってみます。
外してしまいますね、申し訳ないです。


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

投稿者:: @mk2_mk2

これは、具体的にどんな操作をすれば良いでしょう。

 

  1. Cocoon 設定を開く
  2. 設定を変更する
  3. 変更を保存する

 

上記の操作をすると、一瞬「スキン」タブが表示された後、変更保存直前のタブに移動するため少し気になるということです。

現状の動作例

  1. Cocoon 設定を開く
  2. 「固定ページ」など任意のタブを開く
  3. 設定をまとめて保存
  4. スキンタブが表示される
  5. すぐに元のタブに戻る

私も GIF を添付しましたので、ご確認ください(お忙しいところ恐縮です。気長にお待ちしております)。

This post was modified 9か月前 by KonpeitoRO

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
mk2
(@mk2_mk2)
Illustrious Member Moderator
結合: 3年前
投稿: 6933
 

KonpeitoROさん

ありがとうございます。

もうスマホしかないもので、試すことはできないのですが・・・。

これは致し方ない気はします。

全部表示されてから、タブを選択しているイメージなんだと思います。

わいひらさんも以下のように仰っていますし。

投稿者:: @yhira

昨夜超絶簡素なものを作成してみました。

投稿者:: @yhira

・なるべく速度重視でタブと設定内容が全て表示された時点でタブ選択(一番早いのはPHPで書くことだけどそこまではしてません)

他に手はあるのかもしれないですけれど、そこまで必要かどうか。(かかる手間や時間・労力も含めて、そこまで必要かどうか)

速度など遜色なくできるかどうかだと思います。

KonpeitoROさんのご意見はいただきましたので、あとはわいひらさんのご判断のような気はします。


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

皆さんご回答をくださりありがとうございます。
Cocoon 設定を保存後、元のタブに戻る設定は、全部表示されてから選択するというのでないと速度や実装などが難しいとのことですね。
タブのちらつきが気になるので、これまでの設定画面の仕様が良かったのかもしれません。
もしちらつきがなければ、元のタブに戻る仕様はありがたいですが...

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
(@akira)
Famed Member Registered
結合: 6年前
投稿: 1657
 

ちらつきは、簡単に修正できます。

lib/page-settings/_top-page.php の 484 行目から 493 行目の <script> を <input> と <label> の直後の 274 行目 に移動するだけでいいです。

また、気になったのが保存後に表示される「設定は保存されました。」です。保存直後は <h1> の「Cocoon 設定」の上に表示されるのですが、すぐに「Cocoon 設定」の下に移動します。

これについては 118 行目から 143 行目151 行目の <h1> の直後に移動すれば、「設定は保存されました。」は必ず「Cocoon 設定」の下に表示されます。

This post was modified 9か月前 2回 by Akira

   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 6年前
投稿: 16481
 

僕の環境ではそこまでちらつきが遅くなかったのでテストではそのままにしましたが、より速くするなら確かにタブを読み込んだ直後ですよね。
「設定は保存されました。」は今回言われるまで気づいてませんでした。。
Akiraさんの案に忠実に修正させていただきました。
------------------------------------------------
https://github.com/xserver-inc/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

WordPressでの手動アップデート方法はこちら
https://wp-cocoon.com/manual-update-of-cocoon-theme/
------------------------------------------------


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

@yhira さん

ご対応いただきありがとうございます。

早速開発版をダウンロードして適用したところ、ちらつきは目立ちにくくなりました。

一応ちらつきはありますが、かなり速くなったと思います。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
わいひら
(@yhira)
Illustrious Member Admin
結合: 6年前
投稿: 16481
 

今回の仕様で良いでしょうか?


   
(@konpeitoro)
Trusted Member Registered
結合: 1年前
投稿: 48
Topic starter  

@yhira さん

感覚的で申し訳ありませんが、一瞬画面が切り替わり、眼が疲れる気がします。

そのため悩ましいですが、機能性を考えると今回の仕様(タブに戻る)で大丈夫だと思います。

画面切り替えで少し気になるのは、他のプラグインでも同様だと思います。

ありがとうございました。

私は完全招待制のクローズドな Web サイトを WordPress と Cocoon で運営しています。
そのため質問時なども当該サイトのURLは記載できないことが多いです。


   
わいひら reacted
わいひら
(@yhira)
Illustrious Member Admin
結合: 6年前
投稿: 16481
 

僕の環境では全くちらつきがないのですが、構造上環境によってはそうなるのはどうしようもないかもしれません。
とりあえず大きな問題はなさそうなのでこのまま採用しようと思います。


   
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました