Cocoonのコードについて php・HTML・CSS 提案・感想など | 雑談 | Cocoon フォーラム

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

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

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

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

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

wpForoの解決済みリンク

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

wpForoのいいねリンク

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

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

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

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

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

フォーラムのTwitterアカウント(@CocoonForum)はこちら

スポンサーリンク
Share:
Notifications
Clear all

Cocoonのコードについて php・HTML・CSS 提案・感想など  


かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月28日 10:44  

Cocoonのコードを見ていて思った事を、テーマ作成者さんに

  • ねぎらう
  • 提案する

などの雑談。

 

経緯:

トピックの書き込みで提案・案内しているタイプの人間ですが

  • 何かのCSSを見て、これテーマ作成者さんが苦戦したのかなぁ~

って思ったため、ねぎらいがあっても良いのではと思ったんで、自由に書き込むスペース。

 

あと、
タイトルを付けるまでもない事を、トピックが閉まらないから、いつでも書き込めれたら楽。って事で立ててみました。


引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月28日 10:52  

トピックが閉まらないのをいいことに立てたのもありますけど、

CSSを見て苦労されたんだと思う。って思ったのもあります。※どのスタイルだったか、忘れました 。質問の書き込みついでみ見たけどメモってません。ゴメンナサイ😥 

 

ずっとメモしていたことを、まず書きますね。

  • CSSで同じセレクタの装飾でプロパティが被ってる件

他にもありますが、今度またコピペしますね。

 

ココから、メモのコピペ。雑でスミマセンが。

 

display: block;不要

.swatchimages {
display: block;
display: flex;
flex-wrap: wrap;
margin-top: 3px;
}

.swatchimages:hover .si-thumb {
display: block;
display: flex;
align-items: center;
justify-content: center;
}

display: inline-block;不要

.tagcloud a {
border: 1px solid #ddd;
border-radius: 2px;
color: #555;
display: inline-block;
padding: 3px 8px;
text-decoration: none;
font-size: 12px;
margin: 2px;
flex: 1 1 auto;
display: flex;
justify-content: space-between;
transition: all 0.7s;
}

 

 

 

background-colorのダブリ

.recommended.rcs-center-label-title .card-content .card-title {
color: #333;
background-color: #fffffc;
padding: 6px 1em;
opacity: 0.8;
background-color: rgba(255, 255, 255, 0.9);
width: 100%;
transition: all .5s;
}

 

 

padding: 2em 0.6em 0.2em;
とすれば、padding-top: 2em;不要

.eye-catch-caption {
color: #fff;
position: absolute;
bottom: 0;
padding: 0.2em 0.6em;
text-align: right;
width: 100%;
font-size: 0.9em;
background: linear-gradient(180deg, transparent, #555);
opacity: 0.9;
padding-top: 2em;
}

 

top: -13px;不要

.information-box::before,
.question-box::before,
.alert-box::before,
.information::before,
.question::before,
.alert::before,
.memo-box::before,
.comment-box::before,
.common-icon-box::before {
font-family: "FontAwesome";
font-size: 42px;
position: absolute;
top: -13px;
left: 13px;
padding-right: .15em;
line-height: 1em;
top: 50%;
margin-top: -.5em;
width: 44px;
text-align: center;
}

 

 

1つmargin: 0;不要

body {
/* フォントの種類 */
font-family: "游ゴシック体", "Yu Gothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
/* フォントのサイズ */
font-size: 18px;
/* フォントの色 */
color: #333;
/* カーニングの設定 */
/* 行間の設定 */
line-height: 1.8;
margin: 0;
overflow-wrap: break-word;
background-color: #f4f5f7;
text-size-adjust: 100%;
margin: 0;
/* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
background-attachment: fixed;
}

margin-bottom: 5px;不要
margin: 0 0 5px 0;

.entry-card-title, .related-entry-card-title {
font-size: 18px;
margin: 0;
line-height: 1.2;
margin-bottom: 5px;
font-weight: bold;
}

margin: 1em 0;不要

.column-wrap {
display: flex;
justify-content: space-between;
position: relative;
margin: 1em 0;
margin: 0;
}

 

確認した当時はチェックしたけど、今はチェックしてません^^;


チャンビア🍺わいひら 件のいいね!
返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月28日 20:14  

ありがとうございます!
同じカッコ内に書かれている明らかな重複ですね 😥 
修正しておきました。
https://github.com/yhira/cocoon/commit/62f005dd145b3eb2a6f8637c8877f58595766af5#diff-da232d78aa810382f2dcdceae308ff8e
けっこCSSが減ったかも。


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月30日 09:16  

ホント面倒なのに、ご対応ありがとうございます!

 

あとちょっとややこしいのですが、

div id="toc" 領域のCSS、line-height: 1.5;

.toc {
	border: 1px solid #ccc;
	font-size: .9em;
	line-height: 1.5;
	padding: 1em 1.6em;
	margin-bottom: 1em;
	display: table;
	line-height: 2;
}

これも意味ないかも。

https://wp-cocoon.com/google-tag-manager-amp-id/

 

  • 理由

Cocoon設定・本文タブの 本文余白 行の高さ:デフォルトで1.8

https://gyazo.com/bdc78fe29d8f47601c6726991fa57ed7

ユーザーさんが任意の数値を入れてたものほうが優先順位が高いからです。

.entry-content>*, .demo .entry-content p {
	line-height: 1.8;
}

 

.toc { line-height: 1.5;  }の優先順位を上げて、1.5にするか削除しても良いカモ。って思った感じです。

 

*****************

あと同じdiv id="toc" 領域のul・olの padding-left: 1em;は、モバイル・タブレットビューでは効いてません。

 

.toc ul, .toc ol {
padding-left: 1em;
margin: 0;
}


@media screen and (max-width: 834px)メディアクエリ内の以下style
.article ul, .article ol {
padding-left: 26px;
}
  • 理由

CSSの書き込み順で、上のCSSが下のCSS、メディアクエリscreen and (max-width: 834px)内の.article ul, .article olのpadding-left: 26px;を表示しているからです。

 

 

 

**********

同じく目次タブにある目次ナンバーの表示設定で、うぅ…!? って思うこと

https://gyazo.com/62138fb8e610e09f198efb8b8209785a

デフォルトでは表示がキレイです。

https://gyazo.com/702274cc87299f7b4981126b770df44f

 

 

目次ナンバーの表示

  • 表示しない
  • 数字詳細(ex: 1.1.1)

にして、モバイルで見れば左側のスペースが、いきなり気になる感じで。

目次の階層ol・ul入れ子になれば、なるほど左のスペースが気になるので、みんなどうしてるのかな。って思うだけですが

 

  • 表示しない
    class属性:toc tnt-none

https://gyazo.com/61cb6dd7da8aa4a2e27419419e682a01

  • 数字詳細(ex: 1.1.1
    class属性:toc tnt-number-detail

https://gyazo.com/71f505ec2263f7c13b9e549f91f924c2

 

div.tnt-number-detail ol {
padding-left: 0;
} 試しに親テーマstyleの全クエリ欄に適用
/* toc no.none detail */
.tnt-none,
div.tnt-none ul,
.tnt-number-detail,
div.tnt-number-detail ol {
padding-left: 1em;
}

これで『目次ナンバーの表示』『数字(デフォルト)』に近くなって、見栄えが良くなると個人的に思います。

 

  • また
    『数字(デフォルト)』適用されている人には影響がない。
  • あと
    モバイル時に.article ul, .article ol { padding-left: 26px; }に上書きされない

 

優先順位だと思われます。個人的に。

 

もしわいひらさんがもし気になれば。って事と、自分は使ってない機能ですが、見栄えがちょっと気になったんで、報告だけしておきますね。

 

3連チャンでスミマセンが、同じ直すのであれば・・・。って事で分けませんでしたが、未対応部分があれば、またコピペしますね。


わいひら 件のいいね!
返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年1月30日 13:47  

素人が横からすいません。

子テーマのstyle.cssへのcssの追加が1000行を超えてしまいそうな勢い(現在700行)なのですが、これってどれくらい良くないことなのでしょうか?

 

他テーマを3回くらい軽油してcocooonにたどり着き、引っ越ししやすいように便利だったものを加えていくうちにどんどん増えてしまってます。。。

 

追記:有料テーマは結構手を出しましたが、cocoonを知って「ここまでかゆいところに手がとどくテーマがったのか。しかも無料で」と驚きの毎日です。


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月30日 15:45  

Misumiさんに

私なんてどこも商売してないですし、って意味でも、そうでなくっても ド素人ですよ。

子テーマのstyle.cssへのcssの追加が1000行を超えてしまいそうな勢い(現在700行)なのですが、これってどれくらい良くないことなのでしょうか?

個人的には良くないこと。とは思ってませんで❦

 

っていうのも、CSSで装飾するのは、ある意味サイトの個性をだせる。って意味でもあるかもしれない。っておもってるんですね。

パッと見て、ココ前にも来たことがあるサイトだ!って思ってくれれば良いかな。っておもうので

 

 

デメリットがありそうで良くないって思うだろうなぁ。って人用に書いてみれば。

 

ampでエラーが出てSearchConsoleから凄い問題あるよ。って風に案内が来て、焦る。ってのがデメリットかも知れないです。

ampを最大限に利用したい人は50MBだったか??それを超えればエラーが出ます。

 

といっても

ただこのエラーの意味を知ってみれば焦らなくっても大丈夫で

 

単にスマホ検索結果にAMP表示:Googleさんなどのキャッシュを使って爆速でサイト表示できないよ。でも、PCビューのように普通にサイトを表示できるんだけどね。→さらにGoogleスマホ検索結果の機能を最大限使えてないけど、ホントに大丈夫???

ってGoogleのSearchConsoleが伝えてくれてる感じなんです。

結構雑な説明ですけど、乱暴に言えば

 

 

って事で。それはスマホ検索での検索結果の表示※⚡マークがついてる もの

https://gyazo.com/4102b099ad14134f6a722e3a6b5b3fdf

のはスマホviewからの検索・Googleさんとか検索エンジンさんが、爆速で表示させるシステムを上手に使えてない状態だよ。っておしえてくれてるだけ。ちゃだけです

 

PCでアクセスして表示される速度に近い感じで出してくれるのは間違いないんです。って説明しすぎて、よりわかんなくなったかも知れませんが、そんな感じなので、放置でも問題ない。→爆速が欲しいなら多少なりとも気を使っても良いのかもしれないです???

って個人的に思います


わいひら 件のいいね!
返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年1月30日 16:11  

@kautakkuさん

 

とてもご丁寧にありがとうございました。

自分なりのサイトデザイン像があって、配色とかボックスとかにこだわりがあり、気づいたら子テーマのstyle.cssが700行くらいになってて「まずいのかな」と思ってしまったのです。

今のところサチコちゃんから悪いメッセージは届いていないので、大丈夫そうってことで納得しました。

 

 

 

 


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月30日 16:21  

良かったです^^

 

ちなみに私。
サチコにダメじゃん。っていわれて、OK!了解 😊 
ampとして高速表示しないって事、お知らせとして教えてくれてありがとう!

 

でも放置しておくね 🤗 

 

って状態です。ちなみに2000行はないですけど
皆さん気にされているので、私もチェックしたんですが、ブログカード・商品リンクを置くとアウトになりやすいかもしれないです。多分…

私の場合、手を加えなくてもアウトなくらいの容量です。※CSSを全コピーして、文字数をチェックしたら何バイトか分かりやすいですよ。

※検索キーワード例:文字数カウント


返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年1月30日 17:12  
投稿者:: @kautakku

って状態です。ちなみに2000行はないですけど
皆さん気にされているので、私もチェックしたんですが、ブログカード・商品リンクを置くとアウトになりやすいかもしれないです。多分…

2000行と聞いて勇気をいただきました^^

こういう情報って本当に貴重でとても助かります。

ブログカードは引っ越しでいつも失敗してて、できれば自作のがいいのですがCSSが重くなりでそれで気になって質問してみたのです。

Cocoonのブロクカードはとても使いやすいのでこのまま使うか、前からのを使うかで悩ましいところです。

文字数もカウントしてみますね♪


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月30日 19:41  
投稿者:: @kautakku

もしわいひらさんがもし気になれば。って事と、自分は使ってない機能ですが、見栄えがちょっと気になったんで、報告だけしておきますね。

ありがとうございます。
不要な部分は削除し、機能により表示に違和感が出る部分は、修正してみました。
トータルでちょっとサイズがマイナスになった。
https://github.com/yhira/cocoon/commit/c5bb361a1243e4548f4159b80c908da078c2e212#diff-da232d78aa810382f2dcdceae308ff8e


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月30日 19:46  
投稿者:: @misumi

子テーマのstyle.cssへのcssの追加が1000行を超えてしまいそうな勢い(現在700行)なのですが、これってどれくらい良くないことなのでしょうか?

好みのCSSに変更して700行とかであっても全然問題ないと思います。
多少をCSSを書いたとしても、自分好みのサイトになったほうが利点は大きいと思いますし。

あえてCSSが多い場合の難点を書くとすれば、以下ぐらいでしょうか。

  • AMP対応していた場合に、AMPのサイズ制限(50000バイト)を超える可能性が高くなる
  • CSSが多ければ多いほどブラウザーの表示処理に時間がかかる

ただ、CSSが長いと表示処理に時間がかかるとは言っても、1000行くらいでは、誤差程度の時間差くらいしかないと思います。


返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年1月30日 20:09  

@yhiraさん

 

お返事ありがとうございます。

そうなんですね。1000行で誤差程度というのは全然知らなくていつもビクビクしながらカスタマイズしておりました。

 

このアドバイスを受けて、しばらくカスタマイズ楽しんでみます^^

 


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月30日 20:35  

CSS描画時間を体感するとしたらこれかも。
以下は、CSSで描かれた絵画だけど、一般的な書き方で余計な改行を削除して4200行くらい(114KB)。
https://diana-adrianne.com/purecss-francine/
これだけ複雑なもの書くと、多少描画にタイムラグは発生するみたい。

一般的なCSSカスタマイズは、これよりも圧倒的に単純ですし、行数も少ないので、ここまで遅くはならないと思います。


返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年1月30日 21:03  

@yhiraさん

 

事例をありがとうございます。多少遅い表示ですが、SEO的にはこれでも問題なさそうですね。

極端に表示が遅い場合以外はペナルティーはないみたいなので。

 


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月31日 08:09  
投稿者:: @yhira
投稿者:: @kautakku

もしわいひらさんがもし気になれば。って事と、自分は使ってない機能ですが、見栄えがちょっと気になったんで、報告だけしておきますね。

ありがとうございます。
不要な部分は削除し、機能により表示に違和感が出る部分は、修正してみました。
トータルでちょっとサイズがマイナスになった。
https://github.com/yhira/cocoon/commit/c5bb361a1243e4548f4159b80c908da078c2e212#diff-da232d78aa810382f2dcdceae308ff8e

https://github.com/yhira/cocoon/commit/c5bb361a1243e4548f4159b80c908da078c2e212#diff-da232d78aa810382f2dcdceae308ff8eL9165

この部分スマホビューのpadding-left、26pxを消すとpadding-leftが40pxになるんですね

 

スマホの入れ子状態にした場合が分かりやすいかも。
コンテンツが半分になるのが気になりませんか??

右:  現最新版
真ん中:先行バージョン
左:  カスタマイズ済み私の記事・見た目チェック用

真ん中の画像が、今回適用されたリストのstyleです。

 

おまけ、私の記事の

https://gyazo.com/13ed14c98b00ed970e67c28fc1867c00

.article ul,.article ol {padding-left: 26px;}これを削除した状態padding-left: 40px;イメージです。

2つの入れ子でも26px以上って個人的には微妙かも??

 

 

あと

  • 表示しない
    class属性:toc tnt-none

https://gyazo.com/61cb6dd7da8aa4a2e27419419e682a01

  • 数字詳細(ex: 1.1.1
    class属性:toc tnt-number-detail

https://gyazo.com/71f505ec2263f7c13b9e549f91f924c2

 

div.tnt-number-detail ol {
padding-left: 0;
} /*試しに親テーマstyleの全クエリ欄に適用*/
/* toc no.none detail */
.tnt-none,
div.tnt-none ul,
.tnt-number-detail,
div.tnt-number-detail ol {
padding-left: 1em;
}

これ。CSSがすごく増えたように思いますけど(実際増えてる^^;)、ただ
目次デフォルト toc に対しては何も触ってない状況で。

tnt-none tnt-number-detailの需要が分からないので、デフォルト以外の『表示しない」数字詳細に関しては、styleを増やした感じです^^;

 

 

ちなみに何が正解か。どれが好み。など、それぞれなので不明ってのが前提で、わいひらさんならどう思うかなぁって思います。

それと最終的には右へならう方向です❦


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月31日 08:11  

目次は個人的にも完璧だ!って思います^^


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月31日 19:18  

僕の環境だとそうはなっていないんですけどね。


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年1月31日 19:21  

ただ、目次ナンバーの表示が「数字(デフォルト)」のとき余白が少ない不具合があったので2.0.7.3で修正しました。


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月31日 19:42  
投稿者:: @yhira

僕の環境だとそうはなっていないんですけどね。

目次でしたら、そのようにキレイな状態だと思います。

 

https://github.com/yhira/cocoon/commit/c5bb361a1243e4548f4159b80c908da078c2e212#diff-da232d78aa810382f2dcdceae308ff8eL9165

この部分スマホビューのpadding-left、26pxを消すとpadding-leftが40pxになるんですね

.article ul,
.article ol

この指定を変更されたようで、スマホビューの記事内リストが以前と違ってる感じだと思います。

https://wp-cocoon.com/layout/#toc7

この記事の見出しが参考リンクに良いカモです。※320px~あたりの横幅


わいひら 件のいいね!
返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年1月31日 19:57  

それから

https://github.com/yhira/cocoon/commit/fb5c49b696c0a1f565f1ce355f25efd75635dca4

更新されたってことでしたね。

 

また私もチェックしてみますね。

ご対応ありがとうございます 😊 😊 😊 


わいひら 件のいいね!
返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年2月1日 08:29  

2個上の書き込み/#post-27328記事内リストのスマホビューなどのスタイルが気になりますけど、それ以外は良い感じだと思います。個人的に

※2.0.7.3での確認。


わいひら 件のいいね!
返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年2月1日 14:46  

なるほどそっちか 😥
そっちの方は完全にノーマークでした^^;
取り急ぎ最新版で修正しておきました。
https://github.com/yhira/cocoon/commit/dde869326174db43e19e315c1bdc8b5a663f4b51#diff-da232d78aa810382f2dcdceae308ff8e
多分これで大丈夫ではないかなと。


かうたっく 件のいいね!
返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年2月1日 15:36  

今最新先行バージョンにアップロードして確認しました。

 

記事内リスト:以前の通りで影響ない❦

Cocoon設定・目次・目次ナンバーの表示 の以下3点をチェック

表示しない

数字(デフォルト)

数字詳細

良い感じだと個人的に思いました。見落としあればスミマセン

 

※チェック事項は目次のpadding-left・入れ子になったリストも、デフォルトと同じ状況でキレイでだった。という点。大丈夫だと思われます

 

 

書き込みが少ない時に。って思ってたけど
現状すごく多い気がします。

多忙・書き込みが多い中になりましたが、ご対応ありがとうございました!!

 

大変だ^^;
それからおつかれさまでした❦

※2.0.7.5での確認。

This post was modified 5か月 前 by かうたっく

わいひら 件のいいね!
返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年2月1日 20:49  

ご確認ありがとうございます!
CSSセレクタの優先度あたりが、かなりややこしかったので、うまく修正されていたようでよかったです^^


返信引用
みるみ
(@mirumi)
Reputable Memberサイト
参加: 9か月 前
投稿: 264
みるみ - Twitter
2020年2月1日 20:54  

なにやら楽しそうなトピックを見つけました…!

子テーマのCSS追加の話が出てましたが、自分はもう3000行を越えてます。笑

こんなにカスタマイズが楽しいテーマは絶対に他にないと思ってます。もとがシンプルな上に、カスタマイズするときのことが色んな側面から考えられていて本当に感動します。
しかもCSS以外にも多数のオリジナルフックなど…

これからもずっとよろしくお願いします!


わいひら 件のいいね!
返信引用
Misumi
(@misumi)
Trusted Member
参加: 7か月 前
投稿: 77
2020年2月1日 21:53  
投稿者:: @mirumi

子テーマのCSS追加の話が出てましたが、自分はもう3000行を越えてます。笑

頼もしいです!

私は700行超えてチキってしまってました(汗


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年2月1日 22:37  

僕の作ったCOLORSスキンの行数を見たら、240行程度でした。
そう思うと、3000行はかなり多いですね。

こんなにカスタマイズが楽しいテーマは絶対に他にないと思ってます。

デフォルトでは、なるべく打ち消しにくいスタイルは使用しないようにして、一意となるようなクラス名をなるべくつけるようにしたり、カスタマイズのしやすさをかなり考えて作っているつもりだったので、そう言っていただけるのはほんと嬉しいです。


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年2月1日 23:35  

3000行

ココのカスタマイズは凝ってみたんだよね。ってところがあったら、教えてくださぁい

 

どこに凝ったんだろ。ってちょっと気になります^^


返信引用
わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 10065
わいひら - Facebookわいひら - Twitter
2020年2月2日 17:47  

本人じゃないけど僕は、このボタンのギミックが好き 🙂 


返信引用
かうたっく
(@kautakku)
メンバーサイト Moderator
参加: 2年 前
投稿: 4765
かうたっく - Facebook
2020年2月2日 20:30  

その画像のシェア数とかかわいい^^

 

ってか、こんな感じにこんなデザインとかかわいい。素敵・シンプルで良い。みたいなトピックが立つと

これからスキンを作る人とか、デザインの需要的にも参考になるかも^^


返信引用

返信する


許可された最大ファイルサイズ 5MB

 
Preview 0 Revisions Saved
Share:
スポンサーリンク
わいひらをフォローする
おすすめサーバー(コスパ・バックアップ重視型)

性能も兼ね備えながら安くブログ運営を開始できる点においてのNo.1。
それでいてブログ成長後は、十分すぎるほどのスペックアップ余力も担保されている。

◎安く始められる
◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎ディスク容量が多い
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
◎ファイルも14日以内なら無料自動復旧可能
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越し依頼が可能(有料)

サービス運営期間:1年11ヶ月

1年以上の契約をする場合は、クーポンコード入力でさらに10%割引(※2020/12/31まで)。

クーポンコード:PK4JK4RJ

クーポンの使用方法はこちら

とにかく速い。サイトに表示スピードを求めるならココ。
管理画面がシンプルで使いやすい。

◎nginxを用いた高速サーバー(完全SSD)
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎ディスク容量が多い
◎転送量が多い
○http/2(高速化プロトコル)に対応
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
◎ファイルも14日以内なら無料自動復旧可能
◎サーバ引っ越しツールあり(無料)
○サーバ引っ越し依頼が可能(有料)
◎ドメインとサーバー代のチャージ払いが可能

サービス運営期間:1年9ヶ月

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
○DBは7日以内なら無料自動復旧可能
×ファイルは有料かつ手動での復旧
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可

サービス運営期間:16年

常に新しいことに挑戦しているフロンティア精神あふるるレンタルサーバーです。
LiteSpeedやHTTP/2を日本で初めて導入したサーバー。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎ディスク容量が多い
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
○ファイルは14日以内なら無料復旧可能(※手動)
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越し依頼が可能(有料)

サービス運営期間:3年

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
ただし少し機能は弱い。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越し依頼が可能(無料)
◎アダルト・出会い系サイト可
○http/2(高速化プロトコル)に対応
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)

サービス運営期間:4年

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