はてなブログにメールフォームを追加した（WordPressのメールフォーム）

メインで製作中のサイトcoooook.comは、オリジナルドメインにしていますが、
はてなブログです。

そこに、こんなメールフォームを追加してみました。

f:id:wedges:20150128210226p:plain

「iframe」で、レンタルサーバーにあるWordPressのメールフォーム（コンタクトフォーム7）を、読み込んでいるだけですが。

<p><iframe src="http://files.coooook.com/mailform/" width="100%" height="700px" frameborder="0"></iframe></p>

ただし、普通に読み込むと、このような感じになってしまう。

f:id:wedges:20150128210217p:plain

ヘッダーやタイトルとか要らないものも表示してしまうので、テーマのCSSを書き換えました。

使用したWordPressのテーマは、Twenty Eleven。
それを1カラムの設定しにて、下記のCSSをstyle.cssの最後に追加しました。

/* =mailform
----------------------------------------------- */
body {
    background: none repeat scroll 0% 0% #ffffff;
}
#page {
    margin: 0 auto;
}
#branding, .entry-header, #site-generator {
    display:none;
}
#main {
    padding: 0px;
}
.singular.page .hentry {
    padding: 0px;
}