List of “Quick Tags”, TCD’s unique feature to make the decoration of articles more beautiful

The sample list of these quick tags are included in the theme as a configuration file.
We introduce it in the same order as the quick tag button displayed on the editor.

Responsive display of Youtube video

This quick tag displays Youtube video in a post in responsive design.
By narrowing the browser window width you can check the display on the smartphone.
On a PC monitor, even a movie’s width is larger than the main column is resized exactly to the column width.

Content card display of related posts

Links to related posts in the site can be displayed with thumbnail images.

2019.12.22

You can download the logo for free at Logo Marche.

If you don’t set a logo for this theme, the site title and site description will be displayed in text. We’ve tried to make sure that it still looks go…

Column layout

Layout 2c

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Layout 3c

Heading style

H3 Heading a

H3 Heading b

H4 Heading a

H4 Heading b

H5 Heading a

H5 Heading b

Box style

style 1･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

style 2･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

style 3･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Customize * Specify how buttons are arranged

* It is possible to change the color by adding the class specification.

style 1（red）･･･Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

style 1（blue）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

style 1（green）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

style 1（yellow）Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Button style

Flat button（default）
Flat button-L
Flat button-S

Flat button（red）
Flat button（blue）
Flat button（green）
Flat button（yellow）

Round button（default）
Round button-L
Round button-S

Circle round button（default）
Circle round button-L
Circle round button-S

Customize * Specify how buttons are arranged

* You can specify the placement method by enclosing with p tag and adding class specification.

Flat button-L（left）

Flat button-L（center）

Flat button-L（right）

Responsive design of the table

This is a tag for displaying a table created with table tags in responsive design.
By narrowing the browser window width you can check the display on the smartphone.

CSS	What is Cascading Style Sheet?
Responsive design	Responsive design (RWD) is one of methods of Web design, and it corresponds to various kinds of equipment and screen size with a single file. Produce a single file that is set to change the content to the optimum state according to the type and size of the devices and send it to all the devices in the same way …

ブログ