Artwork
解決済み

Artwork ナビ項目の順序について

midobaby

はじめまして。
ホームページの三本線(ナビ項目)内のページの表示順序を変更することは可能でしょうか。
現在、ナビ項目を2つ追加し、category appにて登録した商品一覧を「Items」として表示しているのですが、下記のような順番で表示されてしまいます。
・home
・about
・ナビ項目1
・category app「Items」
・ナビ項目2
・contact

こちらを、下記の順番に入れ替えたいです。もしすべての順番を入れ替えることが難しい場合、ナビ項目1と2が連続して表示され、category appの下に表示されるようにすることは可能でしょうか。
・home
・category app「Items」
・about
・ナビ項目1
・ナビ項目2
・contact

回答が 2件あります

baseadmin

ご質問ありがとうございます。
書いてあるものを並び替える場合、2通りの方法があります。
1つはHTMLそのものを編集して書いてある順番を変えることですが、
この場合はより簡単な方法も可能であるため、もう1つの簡単な方の方法でご案内します。
 
テーマ設定「その他設定」> 「独自スタイルシート」
という欄に以下のコードをそのままコピーペーストしてください。

.navListContainer {
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.nav-item:nth-of-type(1) { order: 1; }
.nav-item.nav-parent { order: 2; }
.nav-item:nth-of-type(2) { order: 3; }
.nav-item:nth-of-type(3) { order: 4; }
.nav-item:nth-of-type(6) { order: 5; }
.nav-item:nth-of-type(7) { order: 6; }
 

今、ドロワー内のカートアイコン表示をOFFにされてますが、それらの関係箇所の設定を変えた場合は上記のコードでは順序がずれてしまうので、ご自身でなんとなく数字を変えて調整するか、またご質問ください。
よろしくお願いいたします。

  1. midobaby

    ご回答いただきありがとうございます。
    こちらのコードにて無事解決いたしました。ありがとうございます!
    ちなみに、別の用件になってしまうのですが、「contact」欄にデフォルトで記載してある「お問い合わせ内容をご入力ください。」という文章についても、同様にコードを使用することでカスタマイズすることは可能でしょうか?こちらの文章を編集する方法がありましたら、教えていただけますと幸いです。
    よろしくお願いいたします。

midobaby

ご回答いただきありがとうございます。
こちらのコードにて無事解決いたしました。ありがとうございます!
ちなみに、別の用件になってしまうのですが、「contact」欄にデフォルトで記載してある「お問い合わせ内容をご入力ください。」という文章についても、同様にコードを使用することでカスタマイズすることは可能でしょうか?こちらの文章を編集する方法がありましたら、教えていただけますと幸いです。
よろしくお願いいたします。

  1. baseadmin

    「contact」の部分は、Contactという見出しからフォームまで、一式でBASEのシステムから出力されているため、テーマのカスタマイズで中身の文章を変えることができません。
    そのテキストを非表示にするだけなら可能ですので、もしよろしければお使いください。
    同じように「独自スタイルシート」に以下のコードを追記します。

    .inquirySection h1 + p { display: none;}

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

  2. midobaby

    承知いたしました。ご回答いただきありがとうございます!

サポートについて

このサイトでサポートしているテーマは、常にご質問を受け付けており、
どんなご質問やカスタマイズのご相談も、デザイナー自身が積極的にお返事しています。
BASEでショップを運営するための相談所としてご利用ください!

テーマは安心の無料アップデート

BASEに新機能が追加された際や、テーマにさらなる機能追加を行った際など、
ご購入いただいた方にはテーマの無料アップデートを提供しています。
アップデートが行われた際には、ご購入頂いたテーマも自動的に更新されますので安心してご利用頂けます。

※ HTML編集Appを利用して作成したテーマは、その編集内容を保護する為に自動更新はされません。
その場合でも「購入済みテーマ」からいつでもそのテーマの最新バージョンを取得可能です。

サポート対応中の人気テーマ