Welcome!

Snippets is a site both created by Wikidot and its community. This is a place where you can find (or add) code snippets that can be used when creating your own pages at Wikidot.com. Code snippets are an easy way to improve your own wiki sites and to make it more attractive and functional. Embedding media, both audio and video, adding spreadsheets, making eye-candy menus is as easy as never before.

> > > > All Tags !


Add a new snippet or solution

Adding a snippet is easy.

  • First, think of some name for your snippet
  • Create a page (using the form below)
  • Assign page tags to the created page
  • Please do not use this site for testing.
  • Use the Sandbox for testing.

Highest Rated Snippets

Collapsible Text Block (Rating: 341, Comments: 40)

This solutions will show you how to make nice collapsible text blocks. What for? See the examples, you should know.

Foldable List (Rating: 205, Comments: 21)

Do you like a foldable list from My Account or Site Manager? Create your own!

Tabs (Rating: 159, Comments: 88)

This solution will show you how to create tabs.

Layout With Tables (Rating: 143, Comments: 91)

A nice way to add advanced layout control using the [[table]] tag. The example uses the style attribute for the whole table and particular cells to adjust layout.

Adding A Site Logo (Rating: 110, Comments: 38)

This snippet lets you add a logo to the site by creating a custom CSS.

Include Any Page (Rating: 107, Comments: 38)

Here is a way to include ANY page within your Wiki page using an [[iframe]] element.

Google Gadgets (Rating: 104, Comments: 27)

Google now offers tons of gadgets one can embed into web pages. The directory of gadgets is available at:

Extra Side Bar (Rating: 101, Comments: 8)

Creates an extra side-bar using the floating div element. It is quite easy if you know CSS.

Automatic Sitemap (Rating: 100, Comments: 22)

It is quite important to have a nice and clean structure of the site. One of the best ways to do maintain such a structure is to use the "parent page" relation. This allows to:

  • display breadcrumb navigation element within pages
  • make nice sitemaps and listings

Multicolumn Layout (Rating: 90, Comments: 26)

OK, so you want a multicolumn layout. Unfortunately there are no special wiki tags for multicolumn layout but the result can be easily achieved using the [[div]] tags and adding CSS style to it.

Recently Added Snippets

snippets.lol (Rating: 0, Comments: 0)

put description what kind of problem does the solution solve and how

Level C-1018 (Rating: 2, Comments: 0)

ccbysa threepointzero

生存难度:生存難度:

等级等級 0

  • 安全
  • 稳定
  • 实体绝迹

如何使用:

[[include :backrooms-wiki-cn:component:level-class
|class=等级
]]


class 处的可用参数包括以下内容,支持简繁体及英文输入。
English 简体中文 繁體中文
0 1 2 3 4 5 0 1 2 3 4 5 0 1 2 3 4 5
unknown 未知 未知
habitable 宜居 宜居
deadzone 死区 死區
pending 等待分级 等待分級
n/a 不适用 不適用
amended 修正 修正
omega 终结 終結

该组件支持简繁切换,如下方代码所示:

[[include :backrooms-wiki-cn:component:level-class
|lang=cn/tr
|class=等级
]]


lang 处选择语言,cn 表示简体中文,tr 表示繁体中文,不填默认选择简体中文。

自定义等级

[[include :backrooms-wiki-cn:component:level-class
|lang=cn/tr
|class=等级名字
|color=#000000(带有井号的十六进制色号代码。)
|image=链接(至图片的链接。)
|one=在这
|two=随便
|three=放文字
]]

使用 CSS 进行自定义:

你可以使用 CSS 进行额外的自定义,将代码放入到 [[module css]] 中或者是放入到页面的版式内都可以。在这一组件中,不要把 [[module css]] 放在 [[include]] 里面,把它放在那个的下面或者是页面的顶部或底部。
将这些代码放入到你的页面/版式中以编辑所有的颜色,因为组件的 |color= 部分仅能控制背景:

[[module css]]
.sd-container {
/* 字体 */
--sd-font: Poppins, Noto Sans SC, Noto Serif SC;

/* 边框 */
--sd-border: var(--gray-monochrome); /* 大多数等级 */
--sd-border-secondary: 0, 0, 0; /* 不适用 */
--sd-border-deadzone: 20, 0, 0; /* 死区 */

/* 标志 */
--sd-symbol: var(--sd-border) !important; /* 大多数标志 */
--sd-symbol-secondary: 255, 255, 255; /* 4 级以上的是白色 */

/* 文本 */
--sd-bullets: var(--sd-border) !important; /* 点句符文本颜色 */
--sd-text: var(--swatch-text-secondary-color); /* 顶部框文本颜色 */

/* 等级颜色 */
--class-0: 247, 227, 117;
--class-1: 247, 227, 117;
--class-1: 255, 201, 14;
--class-2: 245, 156, 0;
--class-3: 249, 90, 0;
--class-4: 254, 23, 1;
--class-5: 175, 6, 6;
--class-unknown: 38, 38, 38;
--class-habitable: 26, 128, 111;
--class-deadzone: 44, 13, 12;
--class-pending: 182, 182, 182;
--class-n-a: 38, 38, 38;
--class-amended: 185, 135, 212;
--class-omega: 25, 46, 255;
}
[[/module]]

旧版颜色:

如果你不喜欢新版的样式,想要用回旧版的红色边框色,只需要在你的页面中与组件一同引入下方的代码:

[[module css]]
.sd-container {
--sd-border: 90, 29, 27;
--sd-image: 90, 29, 27;
--sd-symbol: 90, 29, 27;
}
[[/module]]

练习的草稿文本(1145141919810) (Rating: 2, Comments: 1)

a=int(input('114514:'))
if a == 1919810 :
    print('114514')
insert the code here

new cornify (Rating: 0, Comments: 0)

an update of cornify.

To add tabs to your sandbox so you can have multiple drafts, use the following code: tabview tab Title 1 Text goes here (Rating: 2, Comments: 3)

its an idea i had for an scp its kinda stupid but thats okay

Text changes colors (Rating: 10, Comments: 0)

put description what kind of problem does the solution solve and how

Column Layouts with CSS Grid (Rating: 2, Comments: 0)

Although for a long time there have been ways to create 2-column layouts for your site, none are more effective or efficient than CSS3 Grid Layout. Here, you can see how to use it to create 2 columns, with a gap between them!

测试页面SCP (Rating: 11, Comments: 3)

[[code]]
[[include :scp-wiki-cn:component:customizable-acs
|risk-class= yggdrasil
|risk-image= https://scp-wiki.wdfiles.com/local--files/calibri-s-mega-cool-art-page-it-s-mostly-just-icons-but-what/Yggdrasil.svg
|risk-color= 0,0,255
|inc-risk= —]]]

Do not try in life 2 (Rating: 0, Comments: 1)

put description what kind of problem does the solution solve and how

Do not try in life (Rating: 3, Comments: 0)

[[code]]

/* customizable snowflake styling */
.snowflake {
color: #fff;
font-size: 1em;
font-family: Arial, sans-serif;
text-shadow: 0 0 5px #000;
}

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