Skip to content

Instantly share code, notes, and snippets.

View az1979's full-sized avatar

Kazuki Azumi az1979

View GitHub Profile
@az1979
az1979 / createDatabaseTable.php
Last active April 14, 2017 17:58
WordPressプラグイン作成 - データベース テーブル作成
<?php
public function createDatabaseTable()
{
global $wpdb;
$charsetCollate = $wpdb->get_charset_collate();
$sql = "CREATE TABLE {$this->tableName} (
id VARCHAR(8) NOT NULL,
datetime_register DATETIME DEFAULT CURRENT_TIMESTAMP NOT NULL,
// extension-js.js
export default class ExtensionJs {
constructor() {
console.log('ExtensionJs');
}
}
// extension-jsx.jsx
export default class ExtensionJsx {
constructor() {
@az1979
az1979 / drawer-menu.jsx
Last active September 17, 2017 04:24
Reactで作るドロワーメニューJSX
import { VelocityComponent, VelocityTransitionGroup } from 'velocity-react';
// ドロワーメニューのコード部分
<nav>
<VelocityComponent
animation={{ translateX: this.props.menuDrawerActive ? 0 : -250 }}
duration={300}
>
<div className="drawer-menu">
@az1979
az1979 / drawer-menu.css
Last active September 17, 2017 05:30
Reactで作るドロワーメニューCSS
.drawer-menu {
width: 250px;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
background: #fff;
box-shadow: 8px 0 8px -8px #666 inset;
padding: 24px 16px;
@az1979
az1979 / package.json
Created October 1, 2017 05:16
2017/10/1 現在のpackage.json設定部分
"babel": {
"presets": [
"react",
"env"
],
"plugins": [
"transform-async-to-generator",
[
"transform-runtime",
{
@az1979
az1979 / wordpress-stylish-list.css
Last active December 16, 2017 03:04
WordPressのリストをCSSで綺麗に表示する
.entry-content ul {
counter-reset:list;
list-style-type:none;
font-size: 14px;
}
.entry-content ul li {
position:relative;
color: #fff;
padding: 5px 5px 5px 30px;
margin: 7px 0;
@az1979
az1979 / wordpress-font.css
Last active December 16, 2017 09:34
WordPressのフォントを変更して印象をガラッと変えてみよう
body {
font-family: '游ゴシック', 'Yu Gothic', sans-serif !important;
}
.entry-content p {
line-height: 1.8em;
}
@az1979
az1979 / wordpress-slide-contents.css
Created December 30, 2017 08:19
WordPressの記事の一部を折りたたんで表示する方法 – CSS
.slide-contents {
background: #f2f2f2;
width: 100%;
border: #666 1px solid;
margin: 0 0 20px 0;
padding: 20px 20px 0 20px;
display: none;
}
@az1979
az1979 / wordpress-slide-contents.js
Last active December 30, 2017 09:45
WordPressの記事の一部を折りたたんで表示する方法 – JS
jQuery(function(){
jQuery('[data-slide-contents]').click(function(event) {
event.preventDefault();
var slideContents = jQuery(this).data('slide-contents');
jQuery('#' + slideContents).slideToggle(400);
});
});
@az1979
az1979 / wordpress-slide-contents.html
Last active December 30, 2017 09:45
WordPressの記事の一部を折りたたんで表示する方法 – HTML
<button data-slide-contents="slide-contents-1">スライドボタン</button>
<a href="#" data-slide-contents="slide-contents-1">スライドリンク</a>
<div id="slide-contents-1" class="slide-contents">
テストコメント
</div>