BBCode Help

Hello, I need a bit of assistance; I'd like to make a simple but well put together. I just don't know how to start or what to do exactly to get the results I want. CSS is a bit intimidating to me.
 
Hello, I need a bit of assistance; I'd like to make a simple but well put together. I just don't know how to start or what to do exactly to get the results I want. CSS is a bit intimidating to me.
This is the Iwaku BBCode Guide, it has every single possible tag you can use listed down and such. You can easily get to it anytime by clicking the 'Help' folder of the top bar.

A lot of customization functions are sadly, locked behind divs which in return are dependent on CSS for styling. So give that a look, see if it's what you need and if not, come back to request more help or you can just DM me again and we'll assist you step by step.

You can also just, ask for someone to do it for you if it's too daunting. (not to toot my own horn too much, but I have a graphics/code shop in the Media section where I take requests : P) lol shameless self-promotion ftw

Hope this helps! o/
 
sorta figured out how to edit the new accordions -- haven't figured out the inner margins but:

hello
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium magna non ornare efficitur. Nullam viverra, leo nec posuere auctor, massa nunc iaculis turpis, eget eleifend magna magna quis enim. Duis accumsan condimentum nunc. Quisque maximus vel mi eget dignissim. Donec neque erat, convallis non risus ac, fermentum tincidunt dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eget vehicula ex. Integer quis felis sed felis bibendum ornare. Sed vel dui libero. Sed efficitur et ex non blandit. Maecenas feugiat elit in massa congue, vitae malesuada massa auctor.

Morbi ornare risus volutpat efficitur faucibus. Sed laoreet, magna non iaculis dapibus, ligula sapien rhoncus eros, id interdum mi nunc in mi. Morbi ac elementum lorem, ac sollicitudin massa. In consequat libero metus, a dictum purus elementum congue. Proin tempus lorem at nunc feugiat, et tincidunt turpis porttitor. Integer eu dignissim mauris. Pellentesque non massa in metus gravida mollis. Pellentesque eu lacus mauris. Nunc in lobortis massa. In hac habitasse platea dictumst. Sed a tellus vel elit lobortis scelerisque. Integer vitae ante nec lectus condimentum lacinia non nec orci. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Vestibulum vestibulum lobortis ipsum id luctus. Morbi interdum, nunc condimentum rhoncus blandit, tellus ipsum efficitur massa, et scelerisque dui lacus sed velit. Quisque semper ligula eu turpis tempus, auctor pretium dolor tincidunt. Aliquam a eleifend lectus. Cras eleifend pulvinar metus eu sagittis. Nunc et ante convallis, sagittis lacus a, malesuada turpis. Curabitur tincidunt nec lacus et vehicula. Maecenas lorem nunc, consequat vitae purus in, convallis porta nisl. Pellentesque luctus leo quis lacus pellentesque ullamcorper. Ut sit amet massa felis. Nulla commodo nisi lacus. Integer in erat in nunc rhoncus condimentum. Aliquam mauris nulla, rhoncus non posuere ut, porttitor in quam.



Code:
[div= max-width: 620px!important; height: auto; margin: 0 auto; background-color: #F9DC5C;][div=visibility: hidden;][accordion=100%]{slide=[div= visibility: visible; background-color: #F9DC5C; margin: -7px; padding: 7px;][div=font-family: arial black; letter-spacing: 1px;]hello[/div][/div]}[div= visibility: visible;][div= background-color: #000; color: grey; padding: 15px; ]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec pretium magna non ornare efficitur. Nullam viverra, leo nec posuere auctor, massa nunc iaculis turpis, eget eleifend magna magna quis enim. Duis accumsan condimentum nunc. Quisque maximus vel mi eget dignissim. Donec neque erat, convallis non risus ac, fermentum tincidunt dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eget vehicula ex. Integer quis felis sed felis bibendum ornare. Sed vel dui libero. Sed efficitur et ex non blandit. Maecenas feugiat elit in massa congue, vitae malesuada massa auctor.

Morbi ornare risus volutpat efficitur faucibus. Sed laoreet, magna non iaculis dapibus, ligula sapien rhoncus eros, id interdum mi nunc in mi. Morbi ac elementum lorem, ac sollicitudin massa. In consequat libero metus, a dictum purus elementum congue. Proin tempus lorem at nunc feugiat, et tincidunt turpis porttitor. Integer eu dignissim mauris. Pellentesque non massa in metus gravida mollis. Pellentesque eu lacus mauris. Nunc in lobortis massa. In hac habitasse platea dictumst. Sed a tellus vel elit lobortis scelerisque. Integer vitae ante nec lectus condimentum lacinia non nec orci. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Vestibulum vestibulum lobortis ipsum id luctus. Morbi interdum, nunc condimentum rhoncus blandit, tellus ipsum efficitur massa, et scelerisque dui lacus sed velit. Quisque semper ligula eu turpis tempus, auctor pretium dolor tincidunt. Aliquam a eleifend lectus. Cras eleifend pulvinar metus eu sagittis. Nunc et ante convallis, sagittis lacus a, malesuada turpis. Curabitur tincidunt nec lacus et vehicula. Maecenas lorem nunc, consequat vitae purus in, convallis porta nisl. Pellentesque luctus leo quis lacus pellentesque ullamcorper. Ut sit amet massa felis. Nulla commodo nisi lacus. Integer in erat in nunc rhoncus condimentum. Aliquam mauris nulla, rhoncus non posuere ut, porttitor in quam.[/div][/div]{/slide}[/accordion][/div][/div]
 
Nice! I'm in need of a coder to help me with making char templates and the opener for my Fallout RP. But I don't want to be a bother. ._.;
 
Nice! I'm in need of a coder to help me with making char templates and the opener for my Fallout RP. But I don't want to be a bother. ._.;
i would advise looking through media shops and requests and the coding lab for free to use codes! bbcode help is designed to help you with your codes, not create them for you.

keep an eye out for a new thread in the coding lab tho, might have wat u need
 
I contacted Spectre of the Fade, about assistance in perhaps helping me with DIVs and CSS to help me get the look I am looking for. Actually, one of the set-ups she has for her Vault would work really well with my Fallout RP. Granted I would tweak it to fit the theme of Fallout a bit more.

That's the thing I have a hard time understand; making the block of coding that makes the set-up itself--but I can manage to tweak it just fine and without too much issue. I just need that initial set of coding to mess around with. Heh. ^^;
 
Last edited:
I'm not sure if I should post this in Divtionary or here. So if this is the wrong place, I'll remove it.

Fallout Seattle Intro page

I need assistance; I don't know how to get rid of the borders along the sides?
 
I'm not sure if I should post this in Divtionary or here. So if this is the wrong place, I'll remove it.

Fallout Seattle Intro page

I need assistance; I don't know how to get rid of the borders along the sides?
Could you attach codes + screenshots of your problem? Between work and school I'm not always on my computer and mobile displays things differently!
 
I hope this isn't a stupid question, but how do Font Awesome icons work here?

Like, I know [fa]fa-heart[/fa] produces , which is what I wanted.

How do I produce the outlined heart depicted in this link? I've tried [fa]fa-heart-o[/fa], [fa]far-heart[/fa], and [far]far-heart[/far], and none of them produce the icon. (Further, does this site use Font Awesome 4.7, 5, or another version entirely?)
 
I hope this isn't a stupid question, but how do Font Awesome icons work here?

Like, I know [fa]fa-heart[/fa] produces , which is what I wanted.

How do I produce the outlined heart depicted in this link? I've tried [fa]fa-heart-o[/fa], [fa]far-heart[/fa], and [far]far-heart[/far], and none of them produce the icon. (Further, does this site use Font Awesome 4.7, 5, or another version entirely?)
font awesome* changed their calling thingy


[fa]far fa-heart[/fa]

dunno wat version iwaku has tho
 
Last edited:
  • Bucket of Rainbows
Reactions: Mollisol
I hope this isn't a stupid question, but how do Font Awesome icons work here?

Like, I know [fa]fa-heart[/fa] produces , which is what I wanted.

How do I produce the outlined heart depicted in this link? I've tried [fa]fa-heart-o[/fa], [fa]far-heart[/fa], and [far]far-heart[/far], and none of them produce the icon. (Further, does this site use Font Awesome 4.7, 5, or another version entirely?)
font icon changed their calling thingy


[fa]far fa-heart[/fa]

dunno wat version iwaku has tho
Thank you, you are a peach.
 
  • Sympathy & Compassion
Reactions: rissa
I'm in need of Slider assistance... It's my first time messing with them since the tabs remain with a margin bug by the right, but it won't stop adding an auto-scroller to these even if I have nothing of the sort in the code ^^'

Here's what I'm working on: Slider Experiment

Here's what the code looks like:
Code:
[DIV=width: 65%; margin: auto; height: 805px; background-image:url("https://i.pinimg.com/564x/e6/29/b1/e629b18a850fb260d86846f70974bc2a.jpg"); background-size: 100%; padding: 10px 0px 30px 0px; color: #000000;][div=margin-left: 70px;][SLIDER]
[SLIDE_HEADER]Title 1[/SLIDE_HEADER]
[SLIDE=center][div=height: 725px;]Lorem ipsum placeholder[/div][/SLIDE]

[SLIDE][div=background-image:url("https://i.pinimg.com/564x/31/1e/1d/311e1dc7b92d2178c872882b840b6269.jpg"); background-size: cover; margin-right: -50px;][div=height: 725px; color: #101010;]Lorem ipsum placeholder[/div][/div][/SLIDE]

[SLIDE][div=height: 725px;]Lorem ipsum placeholder[/div][/SLIDE]
[/SLIDER][/div][/DIV]

Did I do something wrong? Is there a way to prevent this? Yes, I do want a scroller in there, but a hidden one and at a proper height cut-off.
Any advices? ^^'
 
Last edited:
Any advices? ^^'

don't use slides, they're finicky as fuck and hard to get mobile friendly dnnfkfnf

i can barely see the code on mobile and i wont have access to my comp for a bit — ill give it a look but no promises fren
 
  • Like
Reactions: Radio Jelly
I"m about to start a Persona rp with various characters from the game on my 'payroll' and just thought it would be AWESOME to know how to make speech bubbles like those found in the game. How should I go about that?

REFERENCES:
September_Screenshot_2017_04_26_02_22_52.jpg
1-P4-00001.jpg
hqdefault.jpg

Obliviously they don't need to be that fancy but character name, image, and space to 'talk' through would be what I'm looking for.
 
@Gossip feel free to use this as a base
Code:
[div=
   height: 0px; 
   width: 0px; 
   border-top: 13px solid transparent;
   border-right: 26px solid #d5d5d5;
   border-bottom: 13px solid transparent;
   margin-bottom: -28px;][color=transparent]·[/color][/div][div=
Margin-left: 15px;
   height: 35px; 
   width: 300px; 
   background-color: #d5d5d5; 
   border: 2px solid #d5d5d5; 
   border-radius: 8px;][div=
   margin-top: 5px;
   margin-left: 15px;
   padding: 3px; 
   color: #000;
   font-size: 0.8em;][font=Courier New]Run.[/font][/div][/div]


·
Run.
 
Thank muchly!
 
@rissa

I fiddled the fuck out of it and am pretty pleased with the results:


aigis___persona_3_movie_avatar_by_seraharcana_d76f0dt.pngAigis
Target acquired.
.
.
Initiating Orgia Mode.


Koromaru --koromaru___persona_3_movie_avatar_by_seraharcana_d76ezun.png
*bark*
*bark*
*growl*


No nvm something's wrong again -_-
 
Last edited:
@rissa

I fiddled the fuck out of it and am pretty pleased with the results:


View attachment 193548Aigis
Target acquired.
.
.
Initiating Orgia Mode.


Koromaru --View attachment 193547
*bark*
*bark*
*growl*


No nvm something's wrong again -_-

So I need help with that mess up there... it looked fine in the PMs but messed up in the forum proper ;_;

gimme a bit to get things settled and i'll give the code a look over. props for fiddling tho! these kinda mistakes are simply how we learn 🥰
 
@Gossip

had to kinda rework the foundation but??? this seems to work & its mobile friendly to boot



aigis___persona_3_movie_avatar_by_seraharcana_d76f0dt-png.193548
Aigis
·
Run.



Koromaru
koromaru___persona_3_movie_avatar_by_seraharcana_d76ezun-png.193547
·
Run.








Code:
[div= max-width: 700px!important; height: auto; margin: 0 auto;]

[div=display: flex; flex-direction: column;][div=flex: 1;][left][img]https://www.iwakuroleplay.com/attachments/aigis___persona_3_movie_avatar_by_seraharcana_d76f0dt-png.193548/[/img]►  [font=Amaranth][size=18][i][b][color=rgb(61, 142, 185)]Aigis[/color][/b][/i][/size][/font][/left][/div][div=flex:1;][div=
   height: 0px; 
   width: 0px; 
   border-top: 13px solid transparent;
   border-right: 26px solid #d5d5d5;
   border-bottom: 13px solid transparent;
   margin-bottom: -28px;][color=transparent]·[/color][/div][div=

   height: 35px; 
   width: 300px; 
   background-color: #d5d5d5; 
   border: 2px solid #d5d5d5; 
   border-radius: 8px;][div=
   margin-top: 5px;
   margin-left: 15px;
   padding: 3px; 
   color: #000;
   font-size: 0.8em;][font=Courier New]Run.[/font][/div][/div]
[/div]

[div=display: flex; flex-direction: column; align-items: flex-end;][div=flex:1;][right][font=Amaranth][size=18][i][b][color=rgb(61, 142, 185)]Koromaru[/color][/b][/i][/size][/font]   ◄  [img]https://www.iwakuroleplay.com/attachments/koromaru___persona_3_movie_avatar_by_seraharcana_d76ezun-png.193547/[/img][/right][/div][div=flex: 1;][div=
   height: 0px; 
   width: 0px; 
   border-top: 13px solid transparent;
   border-right: 26px solid #d5d5d5;
   border-bottom: 13px solid transparent;
   margin-bottom: -28px;][color=transparent]·[/color][/div][div=

   height: 35px; 
   width: 300px; 
   background-color: #d5d5d5; 
   border: 2px solid #d5d5d5; 
   border-radius: 8px;][div=
   margin-top: 5px;
   margin-left: 15px;
   padding: 3px; 
   color: #000;
   font-size: 0.8em;][font=Courier New]Run.[/font][/div][/div]       [/div][/div]


[/div][/div]