WordPress Tabs Slides → ビヨーンと小窓

Wordpress Tabs Slides

文中のリンクをクリックすると、ビヨーンと小窓が出てきます。

{slide=ここをクリックしてみてください} ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン{/slide}

使い方は簡単。

{slide=ここをクリックしてみてください}
ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン
ビヨーンビヨーンビヨーンビヨーンビヨーン
{/slide}

と書くだけ。

デザイン変更

Wordpress Tabs Slides

デフォルトはデザインこんな感じだったので、

plugins/wordpress-tabs-slides/styles/green.css

をいじってデザインを変更しました。

.wts_title a.jtoggle{
    color: #000;
    text-decoration: underline;
    font-size: 1.2em;
    background: transparent url('../ts/arrow.png') no-repeat right center;
    padding-right: 10px;
    cursor: hand;
    }

  ↓

.wts_title a.jtoggle{
	color: #000;
	text-decoration: underline;
	font-size: 1em;
	cursor: hand;
	background-color: transparent;
	background-image: url(green/catch052.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 80px;
	display: block;
	height: 25px;
    }