Skip to main content
Main Content

✧ Spib's Bio and CSS/HTML resources ✧

Posted 2020-11-15 10:56:58 (edited)

List of people who have helped contribute to the forum by providing links and/or resources.
Want to contribute? Send a PM with your links :)

Thank you to all of our lovely contributors! <3



Spibs #12219
[Founder, main contributor]

Arizona #12995
[compiled list of HTML/CSS templates and freebie forums]



Spibs
#12219

Posted 2020-11-15 10:59:08 (edited)

Writing help, mostly

__________________________________________________________________________________________________

Stellaris' Stellar Writing Shoppu
1 review [x]


Spibs
#12219

Posted 2020-11-15 11:00:20 (edited)


__________________________________________________________________________________________________

Stars + Flowers
✪✫✬✭✮✯✰⁂⁎⁑
✢✣✤✥✱✲✵✶✷✸✹✺✻✼✽✾
✿❀❁❂❃❈❉❊❋❆❅⋆≛ᕯ✲࿏꙰ ۞⭒⍟

Brackets
〈〉《》「」『』【】〔〕︵︶︷︸︹︺︻︼︽︾︿﹀﹁﹂
﹃﹄﹙﹚﹛﹜﹝﹞﹤﹥()<>{}〖〗〗〘〙〚〛«»‹›〈〉〱

Chess/Royal symbols
♔♕♖♗♘♙♚♛♜♝♞♟♤♠♧♣♡♥♢♦

Musical

Arrows

Astrology

Gender

Greek symbols

Text 'Font'

__________________________________________________________________________________________________

Relating to borders

Squares / Rectangles

Line Types


Spibs
#12219

Posted 2020-11-15 11:01:55 (edited)

Cheap [$] // Moderate [$$] // A little pricey [$$$] // Will cost you a pretty penny [$$$$]

This category isn't necessarily related to bios or CSS, but I figured that if I am compiling a list of resources, this is similar and important enough to be featured. Below I have compiled a list of forums where you can get Wolvden tags (free, custom, and ptu). Each link is accompanied by a description (and examples when available) so you won't have to search through every link to find what you are looking for.

Please note that none of these forums/art shops/ tag shops/people sponsor me or this forum in any way. Nor does this list include every forum available, just the ones I have found and thought nice and/or useful. If you would like to see your forum listed here, please PM me and we may be able to work something out (I have to accept your forum before I can list it below).


If you have an image for a tag and need it resized, I recommend resizeimage.net. It allows you to resize images (among other functions) using pixels, which is what Wolvden profile tags use to determine size.
(This resource is linked in 'image manipulation' as well, but I mostly use it for resizing tags)

__________________________________________________________________________________________________


Free Explore-Encounter Tags
Made by KahvinPoro

Absolutely gorgeous profile tags, free to use, of explore-encounters.

༻✧༺

Winter's Art Shoppe
Cute YWH Tags w/ backgrounds

Requires purchase [$$]


Spibs
#12219

Posted 2020-11-15 11:08:31

Suggestions welcome (PM or fill out form below)

[reserved space, wip]


Spibs
#12219

Posted 2020-11-15 12:00:35 (edited)


Small pixel buttons are a great way to advertise forums, express excitement for fandoms or pride, or simply add some flavor to a post, signature, bio, etc. Below will be a list of pre-made button resources, as well as a link to creating your own custom button (free), and a short and sweet guide on how to use these buttons.


^ Button example ^
Click here to make your own


__________________________________________________________________________________________________



Premade Button Usage
If you decide to use a free premade button, simply copy the button image URL and insert the image where you want it on Wolvden (bio, forum post, etc.).

Build-your-own-button Usage
If you decide to create your own button, you will need to download the image of your button. Once you have done this, you will need to upload this button image to a hosting site (see helpful hosting list here) and then copy the image URL from there. Once you have the URL, you can insert your button image.

Linking your button
wip

__________________________________________________________________________________________________




Spibs
#12219

Posted 2020-11-15 12:11:01 (edited)


You do not need Photoshop, Photobucket, or any other fancy (and not free) image manipulation program to successfully edit and manipulate photos using the basics.  This post will cover image manipulation using free, easily accessible, online tools.
Largely made possible/ with resources from here



__________________________________________________________________________________________________



Image URLs

PNG/transparent background IMG of your wolves

Royalty-free image sites

Theft and Proper Usage
- crediting images
- obtaining permission

Image editors
- Basic resizing
- Multipurpose
- Extra
- Like Photoshop
- Gif specific

Search by Image


__________________________________________________________________________________________________


As with most sites, you will need to have an image's URL to incorporate it into your post, bio, etc. on Wolvden. To find and copy the URL, use the following steps.

Please note that these steps typically do not work on Apple products. In addition, I apologize for my device being in German; I have provided text translations to help.

Finding and Copying an Image URL
For this example, I will be copying the URL of my Wolvden profile tag.

Step 1. Right-click image (on some devices, right-click = double-tap on the trackpad)
This will pull up a list of actions you may take:


Step 2. Select ' Copy Image Adress'
My device is set in German, so 'Bildadresse kopieren' will not show for you. The English device will say 
'Copy Image Adress'

The image URL is now copied!

Step 3. Insert Image
On Wolvden, there is a couple of ways to do this. You can insert the image using the helpful 'picture' tool displayed when writing/editing posts or bios, or you may insert the image using HTML. I will be going over both, respectively.

Inserting Image using URL through Post Maker/Editor:
Once you are in the post writer/editor on Wolvden, select the picture button. It will appear as follows:

Once you have selected this button, you will be prompted to insert the image's URL (this is what we have just copied in step 2).

Right-click and select 'paste' OR press ctrl+v. Note: ctrl+v may be different on certain devices. If ctrl+v shortcut does not work on your device, google/search which shortcut does the same function (paste function).

Inserting an image from URL using HTML:
No that you have copied the image URL and are in the post maker/editor on Wolvden, you may use the following code to insert your image using HTML.

The width and height fields may be deleted if you do not wish to use them. This will supply you with the image in the original size.


Using the URL from the proper source
NOTE: When using a search engine, DO NOT copy an image URL straight from the search engine. Copy the image URL from the original site itself. The website will always be listed with the image. You can typically either click on the image itself to be taken to the website or click the website linked below the image.

In the example image below, the website that the image originates from is Wikimedia commons. You will want to copy the image URL directly from that site, rather than from the search engine.

__________________________________________________________________________________________________

Save image of your wolf with transparent background (PNG)

Want an image of your wolf without the background? Visit this forum for a quick and easy tutorial.

__________________________________________________________________________________________________


Image/art theft is a pretty big deal, even though it may seem like a small thing. It is also fairly easy to steal images for use on this (or any) website accidentally. To ensure that the images you are using are not 'stolen', you can follow a simple set of guidelines and tips. Above all else: make sure you have permission to use any images/art, and CREDIT THE OWNER/ARTIST


Finding images through a search engine

This seems to be the most common way that images are accidentally or unwittingly stolen. For example, many people will Google an image to use for say, an RP character reference. However, these images often have copyright and usage agreements attached that the user isn't aware of. This could mean the image you are using is stolen.
If you want to find images through Google (or similar search engines), use the tools to do so. What do I mean? Let me show you:

I will be using Google Images for this example, but the process is very similar on most major search engines.

Step 1. Open Google Images


Step 2. Enter search query (search for something)
For this example, I chose to search for 'wolf'. Obviously, you can search for whatever you need

When you 'enter', a large list of images will appear. The way Google (and other search engines) work, is by pulling these images from the web and putting them in one space: the 'images' tab on Google. That means that the images you are seeing have been pulled off of websites, videos, and articles of all kinds. Most of these images are not free for your personal use.

Step 3. Using 'Tools' to narrow search
By using the 'Tools' function on google images, you can narrow your search for images by specific fields. For the purpose of this tutorial, we will be using it to eliminate all images that are not fair-use/creative commons.

The tools button can be found near the top of your screen, under the search bar.

Click on this button. After doing so, you will be presented with a bar that hosts a list of actions you may now do. For our purposes, you will want to click the option titled 'usage rights'

Now that you have that open, you will select 'Creative Commons licenses'.

Now that you have done this, the only images that should appear are those with a CC license. This means they are free to use for personal [you] or educational purposes.

Step 4. CREDITING!!
When using these images, especially on Wolvden forums and such, always provide a link with credit back to the site 


__________________________________________________________________________________________________


Basic resizing

PNG Resizer 

GIF Resizer

 GIF/PNG/JPEG, resize/crop/rotate 


Spibs
#12219

Posted 2020-11-15 12:11:08 (edited)

__________________________________________________________________________________________________

Freeimagehost

This is the one I use most, it's quick and easy

༻✧༺

Imgur

One of the very popular image hosting sites

༻✧༺

Tinypic

Works for some people, but not my favorite by any means

༻✧༺

Photobucket

Another popular site

༻✧༺

Image shack

Never used personally

༻✧༺

Gyfcat

Never used personally


Spibs
#12219

Posted 2020-11-15 12:20:51 (edited)

Copy-paste text-based boxes, and some simple CSS/HTML boxes


__________________________________________________________________________________________________




Basic HTML Box
You can copy this table straight from this post and edit it to your liking :)
Code credit © Lila


Spibs
#12219

Posted 2020-11-15 12:21:11 (edited)

My apologies for not formatting this post the same. Post editor was being difficult.


__________________________________________________________________________________________________

HIGHLIGHT
Dividers used in this forum

༻✧༺
__________________________________________________________________________________________________



TEXT / SYMBOL

✧・゚: *✧・゚:*    *:・゚✧*:・゚✧

.・゜゜・  ・゜゜・.

。・゚゚・  ・゚゚・。

**✿❀ ❀✿**

Ƹ̵̡Ӝ̵̨̄Ʒ*:.*:..*:...。o○  ○o。..:*..:*..:*Ƹ̵̡Ӝ̵̨̄Ʒ

゚+*:;;:*  *:;;:*+゚

☆○o。  。o○☆

*+:。.。  。.。:+*

.。*゚+.*.。   ゚+..。*゚+

☆.。.:*  .。.:*☆

。・:*:・゚★,。・:*:・゚☆   。・:*:・゚★,。・:*:・゚☆

*・゚゚・*:.。..。.:*゚:*:✼✿

✿✼:*゚:.。..。.:*・゚゚・*

︵‿︵‿︵‿︵‿︵

‿︵‿︵‿︵‿︵︵‿︵‿︵

┈ ┈ ┈ ⋞ 〈 ⏣ 〉 ⋟ ┈ ┈ ┈

━◦○◦━◦○◦━◦○◦━◦○◦━◦○◦━◦○◦━

✯¸.•´*¨`*•✿ ✿•*`¨*`•.¸✯

•❅──────✧❅✦❅✧──────❅•

═════════•°• :insert symbol/emoji here: •°•═════════

°l||l°l||l°l||l°l||l°l||l°l||l°l||l°l||l°l||l°l||l°

╳°»。 ∾・⁙・ ღ ➵ ⁘ ➵ ღ ・⁙・∾ 。«°╳

𐄁𐄙𐄁𐄙𐄁𐄙𐄁𐄙𐄁𐄙𐄁𐄙𐄁𐄙𐄁

▢▢▢

☹☻☹☻☹☻☹☻☹☻☹☻☹☻☹☻☹☻☹☻☹

⚛》》》》》◆《《《《《⚛

I͢..... I͢..... I͢..... I͢..... I͢..... I͢..... I͢..... I͢..... I͢.....

◦◦,`°.✽✦✽.◦.✽✦✽.°`,◦◦

●◉◎◈◎◉●

➴➵➶➴➵➶➴➵➶➴➵➶➴➵➶

≡≡≡≡≡ ≡≡≡≡≡ ≡≡≡≡≡ ≡≡≡≡≡ ≡≡≡≡≡

───✱*.。:。✱*.:。✧*.。✰*.:。✧*.。:。*.。✱ ───

─── ・ 。゚☆: *.☽ .* :☆゚. ───

- - ┈┈∘┈˃̶༒˂̶┈∘┈┈ - -

══✿══╡°˖✧✿✧˖°╞══✿══

....::::**•° :insert symbol/emoji here: ☸ :insert symbol/emoji here: °•**::::....

**✿❀○❀✿**

° ∆ -------- ••• ------- ∆ °° ∆ -------- ••• ------- ∆ °

∘₊✧──────✧₊∘

•:•.•:•.•:•:•:•:•:•:•:•☾☼☽•:•.•:•.•:•:•:•:•:•:•:•

——— ☆ • ♧ • :insert symbol/emoji here: • ♧ • ☆ ———

✿°•∘ɷ∘•°✿ ... ✿°•∘ɷ∘•°✿ ... ✿°•∘ɷ∘•°✿

┈┈┈┈․° ☣ °․┈┈┈┈

》* 。 • ˚ ˚ ˛ ˚ ˛ • 。* 。° 。* 。 • ˚《

♪°•°∞°•°♪°•°∞°•°♪°•°∞°•°♪°•°∞°•°♪

* . °•★|•°∵ ৢোি ∵°•|☆•° . *

»»---------------------►

▂▃▅▇█▓▒░۩۞۩ :insert symbol/emoji here: ۩۞۩░▒▓█▇▅▃▂


¸¸♬·¯·♩¸¸♪·¯·♫¸¸¸♬·¯·♩¸¸♪·¯·♫¸¸

▬▬ι══════════════ι▬▬

♫♪.ılılıll|̲̅̅●̲̅̅|̲̅̅=̲̅̅|̲̅̅●̲̅̅|llılılı.♫♪

˚˙༓࿇༓˙˚˙༓࿇༓˙˚˙༓࿇༓˙˚

--:::------::------------------->◇<--------------------::------:::---

⊶⊷⊶⊷⊶⊷⋆⊶⊷⊶⊷⊶

╞╪╪╪╪╪╪╪╪╪╪╪╪╪╪╪╪╡

≪ °❈° ≫≪ °❈° ≫≪ °❈° ≫≪ °❈° ≫

♧⌞⌝⌟⌜⌞⌝⌟⌜⌞⌝⌟⌜⌞♧

¤━━━¤°¤━━━¤°¤━━━¤°¤━━━¤

‧̍̊·̊‧̥°̩̥˚̩̩̥͙°̩̥‧̥·̊‧̍̊ ♡ °̩̥˚̩̩̥͙°̩̥ ·͙*̩̩͙˚̩̥̩̥*̩̩̥͙·̩̩̥͙*̩̩̥͙˚̩̥̩̥*̩̩͙‧͙ °̩̥˚̩̩̥͙°̩̥ ♡ ‧̍̊·̊‧̥°̩̥˚̩̩̥͙°̩̥‧̥·̊‧̍̊

✧⋄⋆⋅⋆⋄✧⋄⋆⋅⋆⋄✧⋄⋆⋅⋆⋄✧⋄⋆⋅⋆⋄✧

╞═════𖠁𐂃𖠁═════╡

┬┴┬┴┤┈┈┈┈┈┈┈┈├┬┴┬┴

|××××××××××|××××××××××|

☾ ⋆*・゚:⋆*・゚:⠀ *⋆.*:・゚ .: ⋆*・゚: .⋆

❁ ≖≖✿❁ ≖≖✿❁ ≖≖✿❁ ≖≖ ❁

⋅•⋅⋅•⋅⊰⋅•⋅⋅•⋅⋅•⋅⋅•⋅∙∘☽༓☾∘∙•⋅⋅⋅•⋅⋅⊰⋅•⋅⋅•⋅⋅•⋅⋅•⋅

✼ •• ┈┈┈┈๑⋅⋯ ୨˚୧ ⋯⋅๑┈┈┈┈ •• ✼

═ ═ ═ ╰☆╮ ═ ═ ═

•┈┈┈••✦ :insert symbol/emoji here: ✦••┈┈┈•

•·················•·················•

__________________________________________

══════════════════

.•*•.•*•.•*•.•*•.•*•.•*•.

»»-------------¤-------------««

☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠◉☠

───── ⋆⋅☆⋅⋆ ─────

✞———————❖———————✞

· · ─────── ·𖥸· ─────── · ·

▂ ▃ ▄ ▅ ▆ ▇ █ █ ▇ ▆ ▅ ▄ ▃ ▂

◈◈◈▣▣◈◈◈▣▣◈◈◈▣▣◈◈◈

*✧・゚: *✧・゚:*✧・゚: *✧・゚:*✧・゚: *✧・゚:

─────────ೋღ :insert symbol/emoji here: ღೋ─────────

◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌ ◌

❀⊱┄┄┄┄┄┄┄┄┄┄┄⊰❀

────── 〔✿〕──────

━━━━━━。゜✿ฺ✿ฺ゜。━━━━━━

༛༛ ༛ ༛༺༻༛ ༛ ༛༛

•• ━━━━━ ••●•• ━━━━━ ••

✧ ▬▭▬ ▬▭▬ ✦✧✦ ▬▭▬ ▬▭▬ ✧

✼ •• ┈┈┈┈┈┈┈┈┈┈┈┈ •• ✼

════ ⋆★⋆ ════

●○●○●○●○●○●○●○●○●○●

■□■□■□■□■□■□■□■

◇◆◇◆◇◆◇◆◇◆◇◆◇◆◇

•─────⋅☾ ☽⋅─────•

▅▄▃▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▂▃▄▅

•◌•◌•◌•◌•◌•◌•◌•★•◌•◌•◌•◌•◌•◌•◌•

───※ ·❆· ※───

༺═──────────────═༻

█▒▒▒▒▒▒▒█ ◈ █▒▒▒▒▒▒▒█

✎﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏

▐░░░░░░░░░░░░░░░░▌

࿇ ══━━━━✥◈✥━━━━══ ࿇

❖ ── ✦ ──『✙』── ✦ ── ❖

❢◥ ▬▬▬▬▬▬ ◆ ▬▬▬▬▬▬ ◤❢

▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰

█ ✪ █▓▓▓▓▓▓▓▓▓▓▓█ ✪ █

━─━─━━─━「₪」━━─━─━─━

◢◤◢◤◢◤◢◤◢◤◢◤◢◤

◑ ━━━━━ ▣ ━━━━━ ◐

▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃

◆:*:◇:*:◆:*:◇:*:◆

╬╬═════════════╬╬

◤◢◣◥◤◢◣◥◤◢◣◥◤◢◣◥

❛ ━━━━━━・❪ ❁ ❫ ・━━━━━━ ❜

『••✎••』

▣▣▣▣▣▣▣▣▣▣▣▣▣▣▣▣▣▣

:۞:••:۞:••:۞:••:۞:••:۞:

✩̣̣̣̣̣ͯ┄•͙✧⃝•͙┄✩ͯ•͙͙✧⃝•͙͙✩ͯ┄•͙✧⃝•͙┄✩̣̣̣̣̣ͯ

✜»✜«✜»✜«✜»✜«✜»✜

ıllıllııllıllı

✧❁❁❁✧✿✿✿✧❁❁❁✧

⋅•⋅⊰∙∘☽༓☾∘∙⊱⋅•⋅

[images]



Spibs
#12219

Search Topic