Sidenote Guide

Sidenote Guide

HOVER YOUR MOUSE OVER ME IF YOURE ON DESKTOP

{$name}

WOOO IM A SIDENOTE

This page exists to explain how to use the sidenote code within your pages.

Sidenotes come in a few variations. One only has text, one only has an image, and one has both.

TEXT ONLY

[[include component:sidenote
contents=CONTENTS|
figure=FIGURE
]]

IMAGE ONLY

[[include component:sidenote
figure=FIGURE|
name=NAME|
type=image
]]

TEXT AND IMAGE

[[include component:sidenote
contents=CONTENTS|
figure=FIGURE|
name=NAME|
type=both
]]

Replace CONTENTS with what you want to be inside the sidenote.
Replace FIGURE with what you want on the title of the sidenote.
Replace NAME with the URL of an image.

Furthermore, you can specify that a sidenote be aligned to the center. Do this by adding "align=center|"

woah look im centered

{$name}

nice

ohh and this one has an image

broo.png

{$contents}

If you want to recolor the hover on a sidenote within a theme, you want to use the following code.

@media (min-width: 1000px) {
    .sidenote:hover .sidenoteH {
        background: #31231c!important;
    }
}

Replace the hex code with the desired color value.

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License