[miyuki]

【お使いの Snow Monkey のバージョン】
【お使いの Snow Monkey Blocks のバージョン】
【お使いの Snow Monkey Editor のバージョン】
【お使いのブラウザ】
【当該サイトのURL】

### 実現したいこと

投稿画面の部分です。

画像→タイトル→テキスト→日付の順を、画像→日付→タイトル→テキストの順にしたい（画像は編集前のものです。）

### 発生している問題

投稿ページでこのような設定になっているが、上記のように順を入れ替えたい。

### 試したこと

投稿画面のため、どのように編集していいか分からず手が止まっています。アドバイスいただけたらと思います。

♥ 0

いいねをした人: 居ません

[GONSY]

@みーな さん

【お使いの Snow Monkey のバージョン】
【お使いの Snow Monkey Blocks のバージョン】
【お使いの Snow Monkey Editor のバージョン】
【お使いのブラウザ】
【当該サイトのURL】

フォーラム参加者も参考にしますので、バージョンなどは必ず記載していただいたほうが良いと思います。

### 実現したいこと

投稿画面の部分です。

画像→タイトル→テキスト→日付の順を、画像→日付→タイトル→テキストの順にしたい（画像は編集前のものです。）

画像がアップされておりませんが、これは【最近の投稿】ブロックを用いたリッチメディア（レイアウト）のことを指していますか？
もしくは投稿一覧やアーカイブページで表示されるリッチメディアのことでしょうか？
もう少し具体的に示されたほうが解決策が出しやすいと思います。

♥ 1

いいねをした人:

[キタジマ タカシ]

Snow Monkey をコードでカスタマイズする場合、基本的には次の3つのいずれかの方法で対応することになります。

1. CSS でカスタマイズする
2. snow_monkey_template_part_render フックで HTML を書き換える
3. My Snow Monkey や子テーマを使ってカスタマイズしたい部分のテンプレートパーツを上書きする

おそらく CSS でカスタマイズできる範囲なのかな？と思いますが、GONSY さんが書かれているように具体的な内容がわかるほうが具体的な回答がつきやすいと思うので、詳細を記述いただければと思います！

♥ 0

いいねをした人: 居ません

[miyuki]

大変失礼致しました。

改めて、初めから質問させ直させていただきます。

 

【お使いの Snow Monkey のバージョン】17.2.7
【お使いの Snow Monkey Blocks のバージョン】16.1.0
【お使いの Snow Monkey Editor のバージョン】8.0.2
【お使いのブラウザ】Chrome
【当該サイトのURL】

### 実現したいこと

投稿画面（アーカイブページ）の部分です。

画像→タイトル→テキスト→日付の順を、画像→日付→タイトル→テキストの順にしたい（画像は編集前のものです。 ）

### 発生している問題

投稿ページでは、元々このような設定になっているが、上記のように順を入れ替えたい。

### 試したこと

投稿画面のため、どのように編集していいか分からず手が止まっています。アドバイスいただけたらと思います。

お手数ですが、よろしくお願いいたします。

♥ 0

いいねをした人: 居ません

[GONSY]

画像があるとわかりやすいですね。
CSSでやるなら position を使って投稿日の要素を動かすのが簡単だと思います。
これにより要素が重なったり、不要な要素はCSSで調整してみてください。

.c-entry-summary__body {
	position: relative;
}

.c-meta__item--published {
	position: absolute;
	top: 0;
	left: 0;
}

♥ 1

いいねをした人:

[キタジマ タカシ]

一応僕は flex を使った方法を。.c-entry-summary__body を flex にすることで、その中の .c-entry-summary__meta（日付が入っている） の順序を入れ替えられるようにしています。

.c-entries--rich-media .c-entry-summary__body {
  display: flex;
  flex-direction: column;
}

.c-entries--rich-media .c-entry-summary__body .c-entry-summary__meta {
  order: -1;
}

♥ 1

いいねをした人:

[miyuki]

ご丁寧な回答をありがとうございます！

両方ともやってみまして、無事できました。

プロパティの勉強になりました。これに紐づけて応用が効くように引き続き学習していきます。

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

♥ 2

いいねをした人:

[投稿者]

投稿