【エロサイト作りたい人必見!】サイトリニューアルの裏側を語る

コラム

サイトを改装した使用済みです。
この記事では、cocoonを使ってこのエロサイトを、ほぼ1から作り直した話をしたいと思います。

 

前日談;改造前のサイトを見た使用済み「こんなものは0じゃなくてマイナスだ!」

ぼくが手をつける前のサイトは…はっきり言って酷かった。

何が酷いかは追々明らかになるのですが…大きな問題は
「固定ページでどうにかしようとしたため、通常のページでは生じない問題が出てること」
「サイトの回遊率を上げる方法は、デフォルトのページに色々付け加えたらできるけど、そちらの方が自動化できてないこと」
の2点でした。

 

「サイトリニューアルやってくれませんか」

ずっと管理人さんと二人三脚でやってきたさやかさんからこの言葉が出ました。

さやかさんという人物は、使用済みの扱いを心得た人物です。
ぼく…つまり、使用済みは批判が始まるとクチも態度も社会性もひどい人を選ぶやつ。

しかし、使用済が批判だけのクソ野郎じゃないことも、よく理解してくれる方です。
それどころか、批判だけのクソ野郎がこの世で一番大嫌いだから、最初から最後まで「好きにやっていいよ」と言われたら、体を壊してでもちゃんと作るものは作るド根性モードに入ることをよくわかってるんです。

詳細は伏せるが、ぼくはさやかさんに改装前のサイトを、
「こんなものは0じゃなくて、マイナスだ」
と、言っちゃったから…ここで引き下がったら男がすたるというわけです。

そこで、改装のモデルにするサイトを見せて
「ぼくがやるなら、こうする。それでいいならやる」
と、提案も兼ねてあるサイトを見せたところ、OKが出ました。

ぼくは満足行く物ができたし、勉強になったからやってよかったと思います。
でも、一週間ほど休みなく色んなことと並行しながら全力疾走して慢性的な肩こりに悩まされてるから、今後の教訓のために、大事な教訓を戒めのために書いておきます。

 

女性の前でイキる時は、自分に跳ね返ってこないか注意しましょう。

イキった結果、「批判だけの男じゃ、男がすたる」と引き受けないといけない責任感とプライドに駆られるとになるから、ことさら嫌われたくない女性の前でビッグマウスを振りまくのはやめましょう。(既婚者の皆様、子育てしない男を批判した後に中出しキメておいて、まさか育児参加しないなんていいませんよね??

女性がでかくて喜ぶのは、男性の身長・総資産・手のひら・おちんちんだけです。
口だけ番長は女性の前だと10倍恥ずかしいし、態度がデカいとそれなりのモノを見せないと納得してもらえませんから…謙虚に行きましょう。

 

さやかさんがどこまで狙ってやったかはわかりません。
しかし、Webへのこだわりが強く、精神的には男らしくありたいぼくの男心をうまく刺激しました。
そして、乗せられないと仕事しないぼくを本気にした上で、管理人さん共々好きにやらせてくれたから、そこはとても感謝しています。

 

「ここまで管理人さん、活躍してなくない?」
大丈夫ですよ、ちゃんと大活躍します。
管理人さんのファンの皆さんが泣いて喜ぶほどの彼の活躍にご期待ください。

エロサイト作りたいやつ必見!やり方もサイト改造理論も、徹底解説するぞ!

リニューアルオープンに向けて、サイトの改装をやったことを1つづつ語っていきます。

WordPress・cocoonでサイトを運営してる人が是非とも参考にしてほしいから資料もセットでお見せしますので、もしよかったらサイト改造の参考にしてください。

ステップ0:モデルになるサイトを見つける&固定ページをやめる

まず、モデルになった元ネタですが、
青二才は振り向かない
というサイトです。(ここからは便宜上の都合で、このサイト・運営者のことは「青二才さん」とお呼びして、話を進めていきます)

青二才さんは、2012年〜2017年ぐらいまではてなブログでちょくちょく話題になったブロガーさんです。
マンガや理屈っぽい社会派トークが好きな人はよかったら覗いてみてください。

デザイン面で何がいいかと言うと
「初心者が作れるサイトの中では一番洗練されていること」
が素晴らしいです。

青二才さん曰く
「俺はコードも書けないし、プログラミングもできない。
だけど、見た目を整えて濃くて面白いサイトを作れる。」
だそうで、ぼくもそこを目指しました。

そのために、まずは固定ページをやめました。
デフォルトの最新の記事が表示されるトップページへ戻し、表示したいモノは自動で表示される仕組みづくりをスタートしていきます。

 

ちなみに、最初は「青二才さんに少しでも近づければいいな」でした。
でも、最終的には青二才さんをも超えるサイトを作ることができました。

ステップ1:カルーセルを使いこなそう

カルーセルというのは、これです。

WordPressの中でも、「cocoon」というテーマを使うと標準装備できる
「カテゴリやタグを使って、読んで欲しい記事をランダムに表示する機能」
のことです。

実装してみたい人はこのサイトを参考にしてみてください。
【WordPressテーマCocoon】カルーセルの設定と使い方

最初の一歩で問題発生!カルーセルには下準備が必要になる!!

青二才さんのサイトは「マンガカテゴリの面白い記事を読んでもらう」ため、青二才さんはマンガを中心に青二才さんが最近書いた記事が表示されるように組まれています。

確かに青二才さんのいう通り、カルーセルを入れるだけなら簡単です。
しかし、このサイトは青二才さんほどカテゴリがまとまってないと、青二才さんと全く同じというわけには行きませんでした。

青二才さんも10年以上ブログを続けてます。
中には、毒にも薬にもならないひどい記事・鮮度が落ちて干からびた記事もあります。
しかし、マンガの記事を増やす際、昔の反省を活かし、機能するカテゴリーにしています。

しかし、このサイトは記事が500以上の記事の「厳選された素晴らしい記事」が表示されません。
そこで、カテゴリーではなく「タグの作り直し」で対応することにしました。

ステップ1.5:「殿堂入り」タグを作ろう

1つのカテゴリを深堀りしてきたけど、玉石混交になってしまったサイトの場合、
「殿堂入り」
「当サイトのおすすめ」
などのタグを使って、表示したい記事をチョイスするのがおすすめです。

「当サイトのおすすめ」はこの記事のような
「表示される場所においておかないといけない記事」
のためのタグです。

この記事は、エロサイトを作りたい世界中の同志たちのための記事であると同時に、管理人さんがぼくなしでもサイトのメンテナンスや、技術的なテコ入れをできるようにするための記事です。
だから、本来は「セール情報」「個人的なイチオシ」のためのタグですが、緊急時対応・備忘録のために、常に表示されやすい「当サイトのおすすめ」タグに入れることにしました。

 

そして、それ以外の「素晴らしいから読んでほしい」という記事には「殿堂入り」というタグを創設しました。

アクセス分析ツールや、人力を活用して、
・まとまったアクセス数があって
・中身の濃ゆい記事を書いているページ
のみを厳選するところから、始めました。

殿堂入り-みんなでエロトーク

このサイトを運営してきたさやかさんも、管理人さんも記事を書くのがうまいですからね!
すぐに「これぞ!」というラインナップが揃うことになり、サイト全体がたくましくなりました。

 

せっかくだから、今回はその一部をご覧にいれましょう。

管理人さんの殿堂入り

「昔は楽しかった」はぜひ前々作の「昔はカッコよかった」を読んだうえでじっくりと味わってほしい。その絶望感がより胸に迫ってきます
心を病んでしまった姉と、姉のことをなんとか救いたい弟の「二人にしかわからない絆」を描いた近親相姦モノをエモく、紹介した作品。FANZA同人を中心に売れた不朽の名作を、管理人さんが最小限のネタバレで、ストーリーラインのグッと来るポイントを集約して描いた素晴らしい記事。

「歌い手のバラッド」最終話感想  この作品はすべての個人の表現活動やその表現を愛する人たちへの賛歌である
これまたストーリーラインが素晴らしい作品で、エロマンガというよりももはや人生を描いたようなストーリー性を中心に描いた作品。
全体的にクセ強めなエロマンガを描くクジラックス先生が、「エロマンガだからこそ描けるドープな作品」を好む管理人さんに刺さって生まれた奇跡の記事。

 

題材選びもさることながら、濃ゆくてヤバい作品を心揺さぶるように紹介する力があるのがうちの管理人さんです。一方で、エロゲにもエロマンガにも造詣が深いため、SNSで話題になるような情報量がすごい記事にも強いです。
普段は集計や浅く広く作品を拾っているからデータ魔のような印象を受けるのですが…一度濃ゆい記事を書くと決めた管理人さんは題材選びから、的確な解説まで、丁寧にこなします。

さやかさんの殿堂入り

管理人さんとは正反対の意味で、ツウ好みなのがさやかさんの殿堂入り記事です。

「夏合宿でハメられたインストラクター」感想・あらすじ含む週刊エロ同人VOl.34「サークルRip&Lip(水原優先生)」様特集!!

水原優先生の「女体の素晴らしさだけで読ませる作品」をあらすじになぞって、クセを出さずに紹介するのですが…わかる人が見ると【一周回ってすごい】と思うような記事です。
ライターという生き物はどうしても「うまいことを言えるような語りがいのある作品」をチョイスしがちなのですが、さやかさんは題材の美しさや、目新しさだけをシンプルに伝えることで、人気の記事を作るのです。

基本的にさやかさんは「女体へのこだわり」が強いです。
二次元三次元問わず、キレイな体へのこだわりが強く、ブログ記事なのに、情報量ではなく「ひと目見ただけでわかる、性癖と女体の奥深さ」で勝負できるのがすごい人です。

 

「玩具少女 無限絶頂に哭く」餅犬製作所(浅貝もっちぬ先生)で永遠にイケ、そして壊れろ

(女体や性癖ではない別角度の)さやかさんの記事の魅力はこれですね。
女性目線の解説や、作品の抜きどころをうまく抜粋してピンポイントに作品の魅力や、エロ素晴らしいところを紹介する記事を書かせると…強いです。

 

一般的に、女性がエロを語る価値は
「女性がエロを語ってること自体がエロい」
「性の知識や、嬢視点を懇切丁寧に説明してくれる」
という面白さがあるんですが…さやかさんは達人すぎて、そこさえ超えてるんです。

超えた結果どうなるかと言うと「女が惚れる女」を紹介したり、「的確に抜きどころを伝える(男性の目線とカチッとチャンネルがあって、ドキッとさせられる記事)」を書いてくるんです。

 

使用済みの殿堂入り

ぼくですね…

緑のルーペ氏の「父の愛人」シリーズを語り尽くす

幼い時から娘を調教して、自分好みの女に育てていくやばい作品。
この作品は、近親相姦自体の背徳感よりもむしろ、「男性が女性に感じる魅力を一人の集約してしまおう」というやばすぎる思想で突き抜けてます。

また、収録された単行本では業の深い女の子の話とかも入ってて、
「男でも女でも正しくエロに狂ってるやつは突き抜けてて抜けるわぁ〜」
という作品です。

 

広告でも見かけるひぐま屋のおねショタ作品は「質感」が素晴らしかった!
ひぐま屋作品は、「ショタが気持ちよさそうにエッチしてる姿」がいいんです。

「頭を使わないで楽しめるエロ同人」の筆頭格みたいな作品なんですが、その秘密は
・設定とストーリーはシンプル
・エロマンガとして濃すぎない代わりにしっかり「抜ける女体」を描いてくる。
・ショタのリアクションがすごくよくて、すごく気持ちよくエッチをする。
というのが素晴らしいんです。

つまり、
エロを楽しんでるヤツらの作品が好き。一緒に高ぶって結果的にすごくいい記事が書ける
のがぼくです。
他の二人よりも【シコりながらオタク語り全開】というシコったテンションをそのまんま出力できるのが強みです。(つまり、ほぼリアクション芸人です)

ポイント:「デザインは精神性」だ。よく向き合ってサイトの良さを再発見せよ!

この後も技術的なことをいっぱい紹介します。
でも、大前提として抑えてほしいのは「サイトデザインは精神性」ということです。

カルーセルに限らず、リンク表示や、検索ツールを作る時には「自分が面白い・客観的にバズってる記事をしっかり洗い出しが大事」になります。

 

これは、モデルになった青二才さんのブログでやっても同じです。

多分、青二才さんはマンガカテゴリーをほぼそのまま出力していますが…それだとカルーセルが
「ド濃厚の面白い記事だけ集まってる場所」
になってないです。まだまだ美味しいところが出せます。

【殿堂入り】というタグを発明したのはぼくです。
でも、青二才さんも、読者の皆さんもドンドン真似して、面白いサイトを作ってください。
各々のサイト・ライターのいいところが出たサイトがウェブ上にあふれた方が絶対楽しい!!
サイトをしっかり整理して、魅力を再発見してギュッと圧縮。それを読者に届けてください。

ステップ2:商品表示をランダム表示にして頭のおかしいサイトを作れ!

今回のサイト改造の目玉として、こんなモノを作りました。

ロリマンガ大好きのぼくがチョイスした25作品のロリコンホイホイです。

今のエロサイトは「FANZA同人がロリ系作品に対応してない」という理由から、ロリ系作品に力を入れてるロリ系作品は少ないのが実情です。
そこで、「ここ3年のロリエロマンガのことなら日本一詳しい」と標榜するぼくが、マンガを中心にFANZAで見落とされがちなロリロリな作品を25個ピックアップして作った、「エロいおみくじ」です。

 

やり方はこうです。

1,このプラグインを入れる。
[WP]広告をローテーション表示できるプラグイン「Ads by datafeedr.com」
2,表示したい商品をグループにぶち込む
3、サイドバーに表示
4、必要なら表示設定をいじる(予定では、カテゴリごとに細かく表示を変える予定でしたが、今回は多忙すぎて断念)

やり方自体は単純なのですが…問題は「何を入れるか」です。

広告以外の応用:「記事バナーのランダム表示」という方法もあります。

今回は突貫工事でできなかったのですが、青二才さんはもうちょっと凝ったことをやってます。

青二才さんは人気コンテンツをサイトに多く抱えてます。
その中でも実用的な記事・思い入れの深い記事を、専用バナーをランダム表示できるようにサイドバーを作っているようです。

300×250のサイドバー用のバナーを自作する必要はあります。
でも、自分オリジナルのバナーを作ってサイト上にランダム表示されるのはオリジナリティが高い。
バナーの作り方さえうまければ、本当にプロが作ったサイトっぽくて、かっこいいですよね。

でも、ぐぐってみると案外誰でもできます。
細かい手間ひまを惜しまない人なら、意外とプロっぽい技術は簡単にできるのです。

ステップ3:いかにもエロサイトっぽいタグクラウドを作る

ここは青二才さんも全くやってない技です。

青二才さんと、うりふたつなサイトを作ろうとしてた時に、管理人さんが
「検索ウィジェットをサイドバーに置かない青二才さん方式だと使い勝手が悪い」
と、ご指摘を頂いたのが、そもそものきっかけでした。

そこから、青二才さんのサイトにも弱点があることが気になってきました。

そして「殿堂入り」を作る過程でも、
「サイドバーに検索と人気記事だけでは、サイトの回遊率が上がらない」
「特に、モバイルでサイドバーを開いた時に検索しやすいボタンが作れないと不便」
という問題点を見つけることができました。

そこで、サイドバーを使い勝手のいいものにして、【青二才さんを超える】戦いが始まりました。

管理人さんの何気ない一言からスタートしたこの戦いは、『これは勝ったでしょ!』と言えるだけの素晴らしいサイドバーを作ることで、達成されました。

 

なにしろ、エロサイトでは定番の「性癖や作家から探すことができるサイドバーボタン」を当サイトにも実装できたのですから。

これでググッとエロサイトらしくなりましたね!

 

さらにですね、通常のタグクラウドと違ってタグを分類するとことで…なんと!
自分で目的や種類ごとに整理されたタグを、いくつも表示できる仕組みなんです!!

なんと!作家さんのタグも作れちゃいます。(制服は私のミス。後で直しました)
下の方にある大文字は『タグがついた記事の多さ』を指していています。

大きなタグは、基本的にはさやかさんお気に入りの作家さん。
もはや、作家さんの追っかけと化したさやかさんによる濃ゆい記事が読めます。

ちなみに、搾精研究所や矢印キーさんなどは管理人さんお気に入りの作家さんで濃いです。
私は数は書いてないから、このタグができたのは、3年間がんばったお二人のおかげです。

しかも、このサイトならではの面白さとして、「夏目響」さんがマンガみたいなサイボーグボディーで、エロマンガ好きな人が見ると「二次元から三次元が出てきちゃった」みたいなAV女優の記事が一番多いことです。

単に定番のエロサイトをなぞるのではなく、タグを集めて独自色を出す。
いやぁ〜本当に素晴らしいことができたと思いますよ!!

やり方も書いておくけど…ちょっと難しいわよ

1,このプラグインを入れます。
【WordPress】タグを分類して表示させるプラグイン
2、タグを自分で決めたグループごとに整理します。
3、タグクラウド用のCSSを、xili-tidy-tags用に書き換えます。

CSSの書き換え(コピペしたらOKというわけじゃなく微調整が必要)という専門的な要素がありますが、それ以外はそんなに難しくないので、よかったらやってみてください。

通常のタグクラウドには多くのカスタマイズ用CSSがあります。
でも、xili-tidy-tagsはエロサイトや各種専門サイト用のプラグインだから、コピペ一発で使えるカスタマイズが…ウェブ上にないです。だから、知識をつけて書き換える必要があります。

CSSの基礎を少し勉強したらできることなので、がんばってください。

 

ステップ4:その他高速化・プラグインの整理・アップデートなど

ここは、私の専門分野じゃないので駆け足で。
「cocoon 高速化」でできるものを一通りやりました。
さらに、今使ってるプラグインのアップデート、PHPのバージョンアップの提案などメンテナンス周りもやりました。

トドメにWordPressを6.0にした結果、操作性が変わっちゃって使いにくかったので、WordPressの新しいバージョンでも古い状態で使いこなせる「Classic Widgets」というプラグインも追加しました。

細かい微調整としては、アイキャッチを中央寄せがデフォルトになるように設定を変更。

多分他にも色々やってる気がしますが、忘れました。
サイトのデザインはおろか、リンク全般の組み換え、サイトメンテナンスの提案と細かなまで徹底的にやったので、正規の業者なら数十万円レベルの仕事はしとると思います。(我ながらめっちゃがんばったので、そこはドヤらせて!)

 

ただし、サーバーの権限だけは私にはないので、あとは管理人さんに頑張ってもらいましょう。
サーバーが、日本でポピュラーなXサーバーなどの情報が沢山出てくるものではなく、エロサイト対応の特殊な会社のものなので、仕様を検索しながらいじるのは大変だと思います。
…Xサーバーなどの事例を参考に、方向性を決め、管理人さんにはがんばっていただければと思います。

 

最後まで読んでいただきありがとうございました。

コメント

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