クラウドワークス事務局を装ったメールが出回っているようです

「クラウドワークス事務局」などを装った複数のメールの存在を確認しているようです。

クラウドワークスからのメールは、以下のドメインより送信されれいます。
crowdworks.jp
crowdworks.co.jp
magazine.crowdworks.jp

メールの送信元を確認してから、偽装の疑いのあるメールについては、記載されているURLなどを開くことなく破棄してください。

詳しくは本家サイトでご確認下さい。
https://crowdworks.jp/blog/?p=1557&ref=mypage_topic

Ubuntu16.04に「Brackets」をインストールする

先日紹介した「Brackets」ですが、WindowsとMacには対応していると紹介しました。

作成したWEBサイトの検証にVMwareを使いUbuntu環境を使っております。
もしかして?っと思いまして、Ubuntuでインストール可能なdebパッケージが提供されていることがあります。
debパッケージがあればインストール可能なのですね。

UbuntuにBracketsをインストールする

Bracketsの公式ページよりOther Downloadsを選んで見てみます。

Brackets-ubuntu-インストール1

 

ありましたね。debパッケージです。

Brackets-ubuntu-debパッケージ

 

GUIでサクサクっとインストールして使えるようになりました。

私のWEB開発環境「Brackets」

Adobe提供のフリー開発エディター「Brackets」を使っています。
Wordpressテンプレートテーマの開発などは、「Sublime Text」が有名ですがBracketsを使っています。
お気に入りのエディタですので紹介したいと思います。

Bracketsとは

Bracketsイメージ

Bracketsとは、HTML、CSS、JavaScriptを開発可能なオープンソースコードエディタです。
Windows、Macなどで使えます。

Adobe社によるとBracketsは、HTML、CSS、JavaScript用となっています。
ですが、C言語系、PHP言語、Ruby言語、Python言語、様々な37の言語でシンタックスハイライトが用意されており、有名な言語なら問題なく使えます。

その上フリーで使えるうえに、導入も簡単でありデフォルトで日本語にも対応しています。
これからはWEBページ制作などの勉強を始める方には、うってつけのエディターではないかと思います。

テーマでデザインを変更したり、拡張で機能の補強も可能で、WEB初学者から上級者まで、幅広くカバーできるエディターになっていると思います。

インストールすると既に日本語表示対応済み

Brackets日本語対応済み

よくあるフリーのエディタは海外製のものが多く、当然日本語には対応していないものが多いです。
デフォルトではEnglishで設定を開いてlanguageをJapaneseに変更するなんて事はよくあると思います。

ですが、Bracketsはインストールしただけで日本語表記になっています。
当然のことながらエディタ内でも日本語は利用可能で、保存すると文字化けするなどと言ったこともありません。

コードを折りたためる

様々なWEBページを開発していくのですが、複雑になればなるほど、多段になればなるほど、改行やタブ、空行を入れたとしてもどんどん見にくいコードが出来上がっていきます。
コードを折りたたむ機能があれば非常にスッキリとした形になります。

HTML

Brackets-コード折りたたみ前

上のコードが折りたたむと下になります。

Brackets-コード折りたたみ後

 

CSS

CSS折りたたみ

PHP言語

Brackets-PHP言語折りたたみ

残念なのですが「if():~endif;」には対応できないようです。
{}で囲むと対応しています。

要素のタグをハイライト表示

開始と終了のタグがハイライトされます。

Brackets-タグハイライト

クイック編集という機能

要素のID、クラス名を右クリックまたはCtrl+EでCSSを編集できます。

Brackets-クイック編集

 

他にも標準機能や拡張機能などがあります。
一度使ってみては如何でしょうか?

WordPress記事投稿画面にオリジナル領域を入れるボタンを追加する

記事を投稿する際、オリジナルの領域を入れたい事はありませんか?
マークアップ言語にはH1、H2、H3のようなタイトルや題名で使われる要素は用意されています。

補足事項や注意事項、注意書きなどと言った特別に強調したい文章を入れたい場合、
文字の色を変える、大きさを変える、太文字にする、改行するなどと言った事しか出来ません。

右側にあるビジュアル、テキストをテキスト側に切り替えてHTML言語でマークアップして
デザインとなるCSSを近くに書いて~などは出来ますが、専門的な知識が必要なため、
全員ができる訳ではありません。

文字の色を変える、大きさを変える等といった操作と同じように、
マウス操作だけでデザインを変更できるようにします。

そのためにはfunctions.phpとstyle.cssにコードを書き込む必要があります。

functions.php

function original_markup_editor_setting($init_original_markup) {
//独自マークアップ追加
$style_formats = array(
array(
‘title’ => ‘補足情報’,
‘block’ => ‘div’,
‘classes’ => ‘point’,
‘wrapper’ => true
),
array (
‘title’ => ‘注意書き’,
‘block’ => ‘div’,
‘classes’ => ‘attention’,
‘wrapper’ => true
),
array (
‘title’ => ‘コード’,
‘block’ => ‘div’,
‘classes’ => ‘DOWATAcode’,
‘wrapper’ => true
)
);

$init_original_markup[‘style_formats’] = json_encode($style_formats);
return $init;
}
add_filter(‘tiny_mce_before_init’, ‘original_markup_editor_setting’);

//スタイルメニューを有効化
function add_stylemenu($buttons) {
array_splice($buttons, 1, 0, ‘styleselect’);
return $buttons;
}
add_filter(‘mce_buttons_2’, ‘add_stylemenu’);

KAZUYA Channelより、北海道の闇-Youtube

報道されない北海道の闇

道民の有名ユーチューバーであるカズヤ(KAZUYA Channel)より北海道の闇に関する動画がアップされています。
気になる方は動画2本を確認して下さい。
2本ともに20分近い長い動画になっています。

その1

https://www.youtube.com/watch?v=qZGWFTrNh9c

その2

https://www.youtube.com/watch?v=fPtYCarakEE

WordPressの記事で使用しないH1要素を使えないようにする

投稿画面でH1要素を使えないようにする

WordPressの記事でH1要素は記事タイトルで使われる。article要素内にH1要素は1つとされています。本文中に複数のH1要素があるとSEO的に良くないとされています。投稿の編集画面で元から選択できないようにする事で選択ミス、ヒューマンエラーを起こさないようにします。

functions.phpに記述することで選択肢から削除することが出来ます。

function editor_setting($init) {
//使わないH1要素を外す
$init[‘block_formats’] = “見出し2=h2;見出し3=h3;見出し4=h4;見出し5=h5;段落=p;”;
return $init;
}
add_filter(‘tiny_mce_before_init’, ‘editor_setting’);

上記のコードでH1要素を選択肢から外すことが出来ます。

注意事項

選択肢を変数$initに格納してadd_filterで設定を投げ込むわけですが、

“”で囲った設定内容にスペースを入れると機能しなくなるようです。要素を選択しても無反応となり、私の場合マークアップできなくなりました。

イコールを見ると両側をスペースを入れたくなるのですが、今回は駄目なようです。

フリーの画像素材をWordPressで簡単手軽に利用する

フリーで利用できる画像素材

フリーで利用できる画像素材には様々なものがあります。

ここでは「Pixabay」から入手できる画像を利用します。高画質・高解像度の画像が数多く手に入ることは勿論、全ての画像がCCOのライセンスとなっており、商用問わず、コピー、改変、そして再配布が認められています。著作者のクレジット表記やリンク等も必要ではありません。

そこで、プラグインを活用して、記事の編集画面からPixabayの画像を手軽に検索・活用できるように設定します。

プラグイン導入手順

  1. ダッシュボードの画面から、プラグイン→新規追加を選びます。
  2. 検索キーワードに「Pixabay」と入力、検索結果にPixabay Imagesが表示されます。
  3. 今すぐインストールを選択します。
  4. プラグインのインストールが終了すると、ボタンが有効化に変化します。有効化を選択します。
  5. プラグインの利用中を選択してPixabay Imagesが表示されてたら利用できるようになっています。お疲れ様でした。
  6. 投稿の編集を確認するとPixabayのボタンが増えてますね。

シェアボタンを設置しました

記事個別ページにシャボタンを設置

記事個別ページにSNSへのシェアボタンを設置しました。

  • Twitter
  • Facebook
  • Google+

の三種を利用できるようになっています。
PC、スマホ両対応しています。

様子を見て他サイトへのシェアボタンを追加していく予定です。

Ubuntu16.04でApache2のバーチャルホスト設定

複数ドメインで利用するバーチャルホストを使えるようにする

動作環境

  • Ubuntu16.04LTS
  • Apache2

1つのWEBサーバーでバーチャルホストを設定し、複数のドメイン名を利用できるようにします。
HTTPサーバApache2のvirtual.host用設定ファイル新規作成する。

# vi /etc/apache2/sites-available/virtual.host.conf

<VirtualHost *:80>
ServerName dowata.com
ServerAdmin webmaster@dowata.com
DocumentRoot /home/dowata/public_html
ErrorLog /var/log/apache2/dowata.com.error.log
CustomLog /var/log/apache2/dowata.com.access.log combined
LogLevel warn
</VirtualHost>
<VirtualHost *:80>
ServerName www.dowata.com
ServerAdmin webmaster@dowata.com
DocumentRoot /home/dowata/public_html
ErrorLog /var/log/apache2/dowata.com.error.log
CustomLog /var/log/apache2/dowata.com.access.log combined
LogLevel warn
</VirtualHost>

# a2ensite virtual.host
Enabling site virtual.host.
To activate the new configuration, you need to run:
service apache2 reload

サービスのリスタートを要求されたのでリスタートさせる。

# systemctl restart apache2

HTC株式、取引を一時停止!?

Janitors / Pixabay

台湾証券交易所(TWSE)は2017年9月20日(現地時間)、台湾HTCの株取引を21日から一時的に停止すると発表。HTCが重要な情報を発表するとしている。この発表後、取引再開する見込み。

HTCについては7日、中国工商時報がHTCスマートフォン部門買収をGoogle社が検討していると報じられた。この話し合いは最終段階、HTCの「重要な発表」はこの件かもしれないと噂されている。

HTCスマートフォン部門主力事業、中国メーカーなどにシェアを奪われ、株価が低迷が続いている。