Luxeritas(ルクセリタス)

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード

https://www.burogu-shiru.com

スポンサーリンク

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード 私困 232x300
困っている人
スマホ表示で2段2列のヘッダーカードを作りたいなぁ

上記のお悩みを解決します。

本記事の内容

  • ルクセリタスで、アフィンガー風ヘッダーカードを作る方法

こんな方におすすめ

  • スマホ表示で2段2列のヘッダーカードを作りたい方

それでは、本題に入ります。

 

アフィンガー風ヘッダーカード

パソコン画面でも、2段2列で表示されます。

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード ルクセリタスアフィンガー風ヘッダーカードパソコン画面  1024x673

スマホ画面(2段2列)

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード ルクセリタスアフィンガー風ヘッダーカードスマホ画面

 

css記述はナシで、htmlだけで表現します。
(htmlにstyle記述をしているだけ)

 

画像の上に文字を重ねようかと考えましたが、CANVAで済ませました(爆)。
パソコンで画像が引き伸ばされたときに、文字がにじまないのか心配でしたが一応大丈夫でした。

個人的には、CANVAのデザインが好きなのでコレで良しとします。

 

flex-wrap

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード ブログの始め方 1024x576

flex-wrapに出会うまでは、スマホ表示では縦に画像やバナーを表示していました。
今回のように、ヘッダーカードもパソコンでは4列だけどスマホでは縦に4つバナーが並ぶ感じです。

しかし、スマホ表示で縦にバナーが出ることが許せませんでした。

【Luxeritasルクセリタス】スマホ表示でアフィンガー風ヘッダーカード img 4776
ばらもん。
スマホって縦に読み飛ばすから、縦でも良いんだけどね

兄弟ブログでAFFINGER6を使っているだけに、どうしてもスマホ表示で2段2列にしたかったわけです・・・。
需要があるのかどうかは分かりませんが、備忘録として残しておくことにしました。

 

いろいろと試行錯誤して頑張ってみましたが、有償テーマのような美しさは到底ありません・・・。

本記事の件は、私が有償テーマへと変更を決めるきっかけにもなりました。

HTMLやCSSは、プロが作成したものを使うのがイチバンです。以上です。

 

そろそろ、有料テーマを使ってみたいと考えていませんか?

 

結論です。
あなたの貴重な時間を無駄にしないためにも『AFFINGER6』を買うことをオススメします。

Luxeritas→SWELLとAFFINGER6の2つのブログ運営をしている私が理由を解説します。

 

AFFINGER6は¥14,800(税込)です。

サラリーマンの時給平均って『1,486円』らしいです。

サラリーマンの給料、時給換算するとなんと平均「1486円」
出典元:マイナビ学生の窓口フレッシャーズ(https://gakumado.mynavi.jp/freshers/articles/14142

 

10時間、働けばAFFINGER6を購入できるって計算です。

私は、別ブログでLuxeritasを1年以上使い倒しました。
自分なりに、CSSやHTMLをカスタマイズしましたがAFFINGER6の『A』にも及んでいませんw。

正直に言って、CSSやHTMLをカスタムするために費やした時間は10時間は超えています。

 

注意ポイント

ググった時間

デザインを考慮する時間

CSSやHTMLを記述する時間

etc・・・

10時間以上の貴重な時間をカスタムに費やしても、思い通りのデザインにできていないのが現実です。
私は職業柄(得意言語はCOBOL笑)、プログラミングには詳しいと自負していましたが勘違いも良いところでした。

 

繰り返します。
あなたの貴重な時間を無駄にしないためにも、AFFINGER6を買ってください。

あなたがどんなに優れたSEであったとしても、たったの10時間でAFFINGER6並のカスタマイズをすることは不可能です。
¥14,800(税込)で【優れたデザイン✕装飾✕操作性のテーマ】を手に入れることができるなら安いとすら感じます。

 

注意ポイント

失った時間は取り戻すことはできません。
CSSやHTMLに時間を費やすくらいなら、記事を書いていたほうが有意義です。

 

Luxeritasで別ブログを運営している運営していた私が断言します。
『AFFINGER6』を買うということ=貴重な時間を買うこと。

 

SWELLかAFFINGER6のどちらにするのか悩まれているなら、『アフィリエイトを追求したいなら』AFFINGER6をオススメします。

SWELLとAFFINGER6の両方を使って2つのブログを運営している私が実際に感じていることです。

 

\ブログ汁限定特典付き/

AFFINGER6(特典付き)を手に入れる

 

特典内容

実際に1位を取った『検索クエリ(月間検索ボリューム500~1000&競合性=低)』

クリック率が上がるタイトルの付け方

SEO効果が期待できる記事の書き方

キーワード選定方法

 

ドメインパワー=6.4でも1位を取れた検索クエリを教えます

特典の性質上『予告なく終了します』!

\期間限定特典(公式)/
『SUGOI MOKUJI(すごいもくじ) [LITE]』
※公式特典についても予告なく終了する可能性があります

迷ってるくらいなら購入をオススメします

 

【AFFINGER6をすでに持っている方へ朗報!】

ブログ汁限定特典パスワードをnoteで販売することに致しました!
(価格¥300)

気になった方は『ブログ汁限定特典』をクリック!

-Luxeritas(ルクセリタス)