2018-01-22

cloud9上でsinatraを利用したい

まずはbundlerをインストールする

$ gem install bundler
# 'Fetching: bundler-1.16.1.gem (100%)'
# 'Successfully installed bundler-1.16.1'
# '1 gem installed'

bundlerを初期化する(Gemfileが生成される)

$ bundle init
# 'Writing new Gemfile to /home/ubuntu/workspace/Gemfile'

Gem fileを編集

# frozen_string_literal: true

source "https://rubygems.org"

git_source(:github) {|repo_name| "https://github.com/#{repo_name}" }

gem 'sinatra'

gemをインストールする

$ bundle install --path vendor/bundle
# Fetching gem metadata from https://rubygems.org/..........
# Resolving dependencies...
# Using bundler 1.16.1
# Fetching mustermann 1.0.1
# Installing mustermann 1.0.1
# Fetching rack 2.0.3
# Installing rack 2.0.3
# Fetching rack-protection 2.0.0
# Installing rack-protection 2.0.0
# Fetching tilt 2.0.8
# Installing tilt 2.0.8
# Fetching sinatra 2.0.0
# Installing sinatra 2.0.0
# Bundle complete! 1 Gemfile dependency, 6 gems now installed.
# Bundled gems are installed into `./vendor/bundle`

ファイルを作成する

touch app.rb

ファイルの中身を編集

require 'sinatra'

get '/' do
  'hello'
end

最後にポート番号とIPを指定して起動する **※重要**
(cloud9側でデフォルトで指定している環境変数なので、中身を知りたい場合は `$ echo $IP` とか `$ echo $PORT`とか実行すると見れる)

bundle exec ruby app.rb -p $PORT -o $IP  
# [2018-01-22 04:40:20] INFO  WEBrick 1.3.1
# [2018-01-22 04:40:20] INFO  ruby 2.4.0 (2016-12-24) [x86_64-linux]
# ~中略~
# [2018-01-22 04:41:13] INFO  going to shutdown ...
# [2018-01-22 04:41:13] INFO  WEBrick::HTTPServer#start done.

2018-01-22

Bitbucket への初めてのpushでエラーになる対処法

bitbucket push deployment key is read-only エラー

git -c diff.mnemonicprefix=false -c core.quotepath=false -c credential.helper=sourcetree push -v --tags --set-upstream origin refs/heads/master:refs/heads/master

Pushing to git@bitbucket.org:mtdsnsk/heatlthlog.git
repository access denied. access via a deployment key is read-only.
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
Completed with errors, see above

BitBucketではSSHキーをユーザーアカウント自体と各レポジトリ毎に設定できる。そして各レポジトリ毎に設定したものはDeployment Keyといって、Read onlyのため要注意。

下記の内容そのままだけど、毎回忘れるので個人的備忘録として残す

personal.loudandproud.me

2018-01-21

トップページ画像スライダーのカスタマイズ

トップ画像のスライダ方式を変更したいとき

jQueryのファイルを入れ替えることで下記のような表現もできるようになる

トップページ画像スライダー / EC-CUBEカスタマイズダウンロード

個人的なオススメのやつだけど、なんだかんだ普通にスライドイン/スライドアウトがよい気がする

凝りすぎるとちょっと煩く感じてしまうので、シンプルなサイトが好みなら、あまりカスタムしないほうがユーザーにストレスを与えないと思う

http://www.kaiplus.com/user_data/add_customize/img_slider/index.php?no=_005

結論

Simple is 'Best'

2018-01-21

EC-cube3のheaderカスタマイズ

ファイルの置き場所

変更するソースの初期状態のものは

/src/Eccube/Resource/template/default/

の中にあります。

しかし、直接変更すると自動的にアップデートされてしまうため、
変更したソースを、

/app/template/default/

にコピー設置することでカスタマイズができます

headerのレイアウトをカスタマイズしたい場合

試しにheaderをカスタマイズしたい場合、

/src/Eccube/Resource/template/default/default_frame.twig

このファイルを下記にコピーします。(元のファイルは残したままです)

/app/template/default/default_frame.twig

内容を編集します。今回は

<header id="header">

の中身に

<div>

タグを加えてみます。

編集前

<header id="header">
    <div class="container-fluid inner">
        {# ▼HeaderInternal COLUMN #}
        {% if PageLayout.Header %}
            {# ▼上ナビ #}
            {{ include('block.twig', {'Blocks': PageLayout.Header}) }}
            {# ▲上ナビ #}
        {% endif %}
        {# ▲HeaderInternal COLUMN #}
        <p id="btn_menu">
            <a class="nav-trigger" href="#nav">Menu<span></span></a>
        </p>
    </div>
</header>

編集後

<header id="header">
    <div style="color: red;">
        aaaa
    </div>
    <div class="container-fluid inner">
        {# ▼HeaderInternal COLUMN #}
        {% if PageLayout.Header %}
            {# ▼上ナビ #}
            {{ include('block.twig', {'Blocks': PageLayout.Header}) }}
            {# ▲上ナビ #}
        {% endif %}
        {# ▲HeaderInternal COLUMN #}
        <p id="btn_menu">
            <a class="nav-trigger" href="#nav">Menu<span></span></a>
        </p>
    </div>
    <div style="color: red;">
        bbbb
    </div>
</header>