Water and Earth

WordPressでphpやらcssのコーディング 練習に使ってるブログ。でも最近はKali の勉強してます。

「記録」に関する記事

Ubuntu 入れたらめっちゃ面白くなった

 

紆余曲折あって、ubuntu を使ってないPCに入れてみました。いやー、おもろいわー。

そんなわけで、備忘録的に調べた単語とか参照したサイトなど残しとく。

 

最初に見てたサイト。

「エンジニアの入り口」はここ数日めっちゃ見てるブログw

 

Linux はディストリビューション(distribution)というのがいろいろあるそうだ。

Linux ディストリビューションについては、このページが非常にわかりやすかった。

Linuxディストリビューションとは|「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典

このIT用語辞典、めっちゃ便利

 

上記のエンジニアの入り口の記事の中に「【目的別】初心者におすすめのLinuxディストリビューション7選」って記事があるんで、それ参考にしてubuntu ってディストリビューションにしてみた。

Ubuntu 18.04 LTSインストールガイド【スクリーンショットつき解説】 – Linux Fan

 

 

LinuxディストリはDLしてインストールすればいいのかと思ってたら、そうじゃないらしい。

「ライブUSBメモリ」または「ライブDVD」ってのを作っておくか入手するそうだ。

ライブUSBメモリを自分で作る場合、USB メモリが必要になるんだけど、「SDカード+USBへの変換アダプタ」でもいけるそうだ。てかいけた。作り方はこのブログ記事参照。

Linuxをインストールできる「ライブUSBメモリ」をWindowsで作成する方法【スクリーンショットつき解説】 – Linux Fan

この記事に載ってるRufus(ルーファス)ってソフト、最近バージョンアップしたのか記事に載ってたダイアログ写真とほんのり違ってました。そんなに大きな違いはないけど、「ISOイメージの選択」の場所が変更になってます。

 

ああそうそう、ISOイメージファイルってなんなのさ!と思って調べたよ。

ISOイメージファイルとは|「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典

イメージと付く(表記される)けど、画像ファイルのことじゃないらしい。

 

 

ubuntu のDLは公式サイトよりドゾ。日本国内のダウンロードサイト一覧もアルヨ。

Ubuntu は日本語チームもあって、日本語で使うのをサポートしたパッケージがすでに入ってる Ubuntu Desktop 日本語 Remix ってのが配布されてます。

Ubuntu Japanese Team

ISOイメージファイルとtorrent ファイルってのがある。ISOイメージファイルは上記にリンクしたとおり。

torrent ファイルってのは、「どこどこにアクセスすれば、欲しいファイルが手に入るのか?」って情報のファイルだそうだ。このブログ記事参照

Torrentファイルの開き方!どうやってTorrentをダウンロードするの?日本猿でもわかる? – VPN情報局

 

 

さて、ここまででようやく下準備が完了。

ライブUSB メモリはSDカードで作ったので、家の空きPCその1にUSB への変換アダプタ使ってSDカード差し込んでPCを起動。

勝手に読み込んでってくれて、画面中央下に左にメモリスティックみたいなアイコンと右に人みたいなアイコンが表示される。ライブUSB メモリを読み込んでる表示みたい。

次に文字がでて、「このPCのCPUだとこのカーネルには不足でーす。適切なCPUにしてネ☆彡」みたいなメッセージが出る(かなり意訳)。

 

Ubuntu の本家サイトを見に行って必要スペックを確認してきた。

Ubuntu 18.04 LTS(5月にリリースされた最新版)だと

・2GHz のデュアルコアプロセッサ、もしくはそれ以上

・2GB のメモリ

・ハードディスクの空きが25GB 以上

・DVDドライバかUSB のポート

・ネットアクセスがあると助かるよ!

…だそうです。

空きPC その1ではダメみたいです。

 

空きPCその2に入れてみたら、無事インストールかトライか選択する画面が出てきた。

これでインストールを選択。インストールと同時にタイムゾーンとか設定をして、とりあえずインストールは終了。

Chapter6-2 終了

chapter5 のコメント関係は、コメント作ったその日にスパムコメントが入って、対応が面倒になったので表示させないことにしました。

なので、Chapter5 のコメント関係はまた後ほどやることにする。

 

 

先々週だったか、背景色をつけて各パーツのマージンやらパディングを確認してて、そのまま放置してます(現在進行形)。

それはいいんだけど、その時に『あれ?タグ書く行、違ってね、コレ?』ってことがあって、さっきもchapter6-2 をやってたら、やっぱりタグを書き込む行を間違えてたっぽいところを発見。あっれー?

 

出版社のサイトにサンプルデータが置いてあるみたいなので、それちょっと見てきます。DLはしたけど、まだ開いてない。たぶん出来上がってるindex.php のデータもあるはずだろうから、それ見てどこの行が書き間違えてるのか確認したい。もうめっちゃ気になるわー。

あ、あと出版社のサイトのこの本のページを見てきたら、補足情報が載ってた。誤表記があったらしいけど、色の指定は、書いてたら普通にわかる希ガス。もういっこは増刷の時に修正かかってるっぽい。私の持ってる本は初版の4刷だけど、本のほうはもう直ってたし。

こういう補足もちゃんとやってくれると便利。しかし、wordpress のバージョンがもう違いすぎてるけどねw

出版社のサイト:http://www.socym.co.jp/book/924

 

今この記事をプレビューで確認したら、タイトルの出る場所がオカシイよ(記事下に出てるw)!

さっきindex.php をいじってたからか!ouch!!

 

【追記】

あっという間にタイトルが元の位置に戻りました。ひと安心。(´▽`) ホッ ←index.php を修正してきた

あれ?トップページの各記事にナビ付けないようにしてたはずだけど、さっきいじったら出るようになってしまった…。ってことは最初に書いた行であってたのか??

こりゃ、サンプルデータの確認だな!

 

【さらに追記】

サンプルデータ確認してきたー!

あっちを修正したら、こっちがおかしくなって…を数回繰り返して、なんとか本に出てた見た目になりました。

やっぱ全文で確認って大事よねー。本だとページの関係で略されてるので、『不便だなー』ってずっと思ってたんよね。←だったら確認しに行け

ウィジェット2 の問題、解決

widget は、style.css で display:block を指定してある。widget2 はこの指定をなくしたい。ってことで、別々にしてあるのですよ。

「カテゴリー」、「月別アーカイブ」、「最近の投稿」、「RSS」はwidget のスタイルを使用。

本の紹介はwidget2 のスタイルを使用、って感じどす。

 

まず、function.php に

//ウィジェット
register_sidebar();
register_sidebar();

と2つ目を追記。

 

次にindex.php で、1つ目のwidget の下に

<?php dynamic_sidebar(2); ?>

とだけ入れて、ページを表示。「ソースを表示」でソースを見てみる。

 

ソースではすでに<li></li> で囲んであった。

<li></li> はul かol とセット使いみたいなので、index.php のwidget2 の部分に

<div class=”blogmenu2″>
<ul>
<li class=”widget”>
<?php dynamic_sidebar(2); ?>
</ul>
</li>

と表記。

 

style.css のウィジェットの部分にwidget2 のスタイルを追加。

.blogmenu2 ul {margin: 0; padding: 0; list-style: none}
.blogmenu2 .widget {padding: 20px; background-color: #efefef}
.blogmenu2 li a {color: #666666; font-size: 14px; text-decoration: none}

 

うーん、li class=”widget” でいいんだろうか?? textwidget ではなかろうか?とちょっと悩む。あー、でも、自分でつける分類名(class)だからwidget でもいいのか(たぶん…)。

あと、.blogmenu2 ul でpadding を0に指定して、.blogmenu2 .widget でpadding をさらに指定してあるのは、どーなのよ?と思う。ここら辺は本を参考に書いてるので、どっちのパラメータにpadding を入れると表示が好みな感じになるのかまだ不明。

[追記]

.blogmenu .widget の paddingは 1px 25px 30px にしました(上 左右 下)。ここでpadding を使って上のpadding を入れとかないと、いきなり画像が上端になる。でも、padding を指定すると勝手に見出し(ウィジェットタイトル)分のスペースが入ってしまう希ガス。なので、padding 1px (上部)にしてみた。他に何かいい方法はないのだろうか?

 

コードをブログ記事内で書いてあるときは、<pre><code>~</code></pre>で囲むことにしました。今のところ、この書き方だと、どーにも表示が好みじゃないので、<pre style=”background-color:#f5f5f5;”> でスタイルを指定してます。でも、これもやっぱり表示が好みじゃなかったりするけど。。。

→ <pre><code>~</code></pre>で囲むと、今現在スマホでブログ見た時にテキストが背景色掛けてある部分からはみ出ることに気が付いたので、<div style=”background-color:#f5f5f5;”></div> で囲んで背景色をつけただけにしました。

 

 

参考