BBCode Help

Status
Not open for further replies.
rissa

rissa

the clairvoyant pterodactyl
Original poster
VENGEANCE
DONATING MEMBER
MYTHICAL MEMBER
BBCODE AND DIVBOX INQUIRIES
A place specifically designed for bbcode and divbox related questions! Need help figuring out a bit of code? Not sure why your code keeps breaking? Unsure if what you want to do is even possible? Fret not! This thread's creation is for the sole purpose of helping you figure out your coding, one question at a time.
F. A. Q.
H E L P F U LxxL I N K S

 
Last edited:
  • Love
Reactions: tascha, Nemopedia, Gossip and 11 others
Rapping-Monster said:
Something else. Like, outside the text.
Click to expand...
There are several bbcodes on Iwaku which allow you to create a border effect around text.

There's fieldbox,
[fieldbox=Fieldbox, purple, solid]content goes here[/fieldbox]

Fieldset,
Fieldset:
content goes here


Dash,
[dash=purple]I have a purple dash border around me[/dash]

Dotted,
I have a purple dotted border around me


Solid,
I have a solid purple border around me


Table,
I have a solid purple border around me

And lastly divs
I have a soid purple border around me


We already know that you're not referring to divs, but can you let us know exactly which of the bbcodes you're having trouble with? We'll be able to help more if we knew which direction we're going :)
 
  • Useful
Reactions: Nemopedia
The table one. And how can I change the name for some coding things(which I don't know how to refer it as)?
 
@Rapping-Monster

Maybe you mean how do you change the text over top of it? Or maybe the color? Here, this may help. I altered based on the div, because it's a bit more flexible, and can look really nice with large blocks of text when coded like this.

Title
Lorem ipsum dolor sit amet, consectetur adipiscing 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. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing 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. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Lorem ipsum dolor sit amet, consectetur adipiscing 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. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Code: 
[div=margin: auto; width: 90%;][color=#E6E6FA][size=5]Title[/size][/color]
[div=padding: 10px; border: 2px solid purple;]Content goes here.[/div]

You can change how far from the edges the text is by adjusting the number after 'padding', and the border's appearance can be changed by adjusting its thickness (the number), type (solid, dashed, dotted), and color (can use name or hex code, which is the pound symbol (#) followed by six letters/numbers.

You can change the size and color of the title by editing the two tags before it (tags being the things in the brackets).

Finally, you can adjust the size of the entire thing by adjusting the number after 'width'.
 
  • Useful
Reactions: darkflames13
darkflames13 said:
I'm sorry, but I don't quite understand what you mean by this. What name are you referring to? o:
Click to expand...
Those things that you use to insert a spoiler or something.
The Mood is Write said:
You can change how far from the edges the text is by adjusting the number after 'padding', and the border's appearance can be changed by adjusting its thickness (the number), type (solid, dashed, dotted), and color (can use name or hex code, which is the pound symbol (#) followed by six letters/numbers.

You can change the size and color of the title by editing the two tags before it (tags being the things in the brackets).

Finally, you can adjust the size of the entire thing by adjusting the number after 'width'.
Click to expand...
Thanks~ but how do I insert it in?
 
Rapping-Monster said:
Thanks~ but how do I insert it in?
Click to expand...
Copy the code from the scrollable area, and paste it in where you want to use it.

You can also use one of these. Try them out in the testing subforum to find out what they do!

Code: 
[spoiler]test[/spoiler]
[spoilbb]test[/spoilbb]
[spoili]test[/spoili]
[quote]test[/quote]
 
  • Like
Reactions: darkflames13
Is it possible to justify content (such as character sheets, stories, etc. not the accordion title) inside accordion tabs?
 
Kat said:
Is it possible to justify content (such as character sheets, stories, etc. not the accordion title) inside accordion tabs?
Click to expand...
Yeap! Not sure if the justify bbcode works, but you can use divs inside accordions and just set it to have the text-align property set to justify.

[accordion]
{slide=title}[div=text-align:justify;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis scelerisque orci. Ut non leo tempor, ullamcorper nunc quis, laoreet libero. Proin finibus bibendum hendrerit. Etiam mattis non dolor viverra aliquet. Donec lacus nunc, luctus commodo cursus non, bibendum sit amet elit. In molestie ipsum sit amet massa condimentum, sed convallis metus consequat. Ut tortor risus, fringilla non velit nec, dignissim dictum ex.

Quisque eget rutrum dui. Vivamus iaculis libero sed magna volutpat, vitae tristique neque dictum. Duis felis nibh, venenatis a libero vel, placerat cursus lorem. Donec ut sapien tincidunt, venenatis magna a, fermentum massa. Donec consequat, justo vel venenatis laoreet, lectus odio hendrerit metus, non consectetur dolor ligula ac lorem. Curabitur eget convallis nisi. Nam pretium ultrices enim, at pulvinar ex vulputate ut. Etiam commodo fermentum fermentum. Suspendisse potenti.[/div]{/slide}[/accordion]


Edit: Just tested, justify bbcode also works. Wasn't sure earlier if it was broken or not :'D
 
darkflames13 said:
Yeap! Not sure if the justify bbcode works, but you can use divs inside accordions and just set it to have the text-align property set to justify.

[accordion]
{slide=title}[div=text-align:justify;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis scelerisque orci. Ut non leo tempor, ullamcorper nunc quis, laoreet libero. Proin finibus bibendum hendrerit. Etiam mattis non dolor viverra aliquet. Donec lacus nunc, luctus commodo cursus non, bibendum sit amet elit. In molestie ipsum sit amet massa condimentum, sed convallis metus consequat. Ut tortor risus, fringilla non velit nec, dignissim dictum ex.

Quisque eget rutrum dui. Vivamus iaculis libero sed magna volutpat, vitae tristique neque dictum. Duis felis nibh, venenatis a libero vel, placerat cursus lorem. Donec ut sapien tincidunt, venenatis magna a, fermentum massa. Donec consequat, justo vel venenatis laoreet, lectus odio hendrerit metus, non consectetur dolor ligula ac lorem. Curabitur eget convallis nisi. Nam pretium ultrices enim, at pulvinar ex vulputate ut. Etiam commodo fermentum fermentum. Suspendisse potenti.[/div]{/slide}[/accordion]


Edit: Just tested, justify bbcode also works. Wasn't sure earlier if it was broken or not :'D
Click to expand...

Awesome! Thank you so much; The justify bbcode doesn't work, as far as I know. I appreciate the help! :)
 
  • Like
Reactions: darkflames13
I need your help; I know technically I'm not supposed to contact you but I've tried asking everyone I could think of and wither, they don't respond, don't know tables coding, or they tell me to use CSS or HTML or Excel Spreadsheet--which I have no idea how to implement it into the code I've got.
What the problem is, I've tried to make a table, for character stats and such.
I used:
Code:
Code: 
[table][tr][td="border: 1px solid blue;"]Blue Cell 1[/td][td="border: 1px solid green;"]Green Cell 2[/td][td="border: 1px solid red;"]Red Cell 3[/td][/tr][/table]
Except they are all gold, not color coded; Still trying to get the background gold as well so the black lettering pops out a bit more, but that's another question.
My MAIN issue is, that the table goes across the page and you have scroll to the side to see all the stats. How do I fix it so that its centered? I've been at it for a week and I can't fix it.
 
Hi guys 8D

So I borrowed some code fro @darkflames13 to have like... a transparent-ish box with text on it, covering an image. Something like this CLICK ME

But I'm honestly not sure what I'm doing and was wondering if I could have like an "empty" version of that?

Is the font opacity really "dependent" on the level of the box's opacity?

Thanks 8D
 
Pahn said:
Is the font opacity really "dependent" on the level of the box's opacity?
Click to expand...
if you use a rgba color code for the background color (the a is the opacity), i believe it defaults the text to fully opaque

lorem lore lorem lorem


Code: 
[div=
   width: 100px; height: 100px; background-color: rgba(255,0,0,0.2); color: black;]lorem lore [color=yellow]lorem[/color] lorem [/div]

after dinner i can delve into your other questions!
 
rissa said:
if you use a rgba color code for the background color (the a is the opacity), i believe it defaults the text to fully opaque

lorem lore lorem lorem


Code: 
[div=
   width: 100px; height: 100px; background-color: rgba(255,0,0,0.2); color: black;]lorem lore [color=yellow]lorem[/color] lorem [/div]

after dinner i can delve into your other questions!
Click to expand...
Oh thanks! But I meant specifically for a bit of code, lemme grab it.


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vehicula rutrum leo, eu molestie metus facilisis ullamcorper. Nulla vel dignissim odio. Aliquam a condimentum mi. Integer sollicitudin gravida turpis sit amet tempor. Etiam facilisis faucibus mauris id fringilla. Ut a felis convallis, interdum nibh sit amet, accumsan elit. Nam ut erat felis. Maecenas lacinia felis pretium nibh consequat, sit amet iaculis turpis dictum. Aliquam pretium sollicitudin ligula vel vestibulum. Phasellus rhoncus magna vel lacus efficitur varius. Nunc a orci et sem consectetur elementum et sed lacus.



Code: 
[div=background:url(http://i.imgur.com/JBUUQao.png); background-size: 800px 720px; width:780px; height:700px; padding:20px 0px 0px 20px; overflow:hidden; margin:auto;][div=background:black; border-radius:20px; width:580px; height:600px; opacity:0.20; color:white; padding:15px 15px 15px 15px; overflow-x:auto; font-size:10px; font-family:verdana;]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vehicula rutrum leo, eu molestie metus facilisis ullamcorper. Nulla vel dignissim odio. Aliquam a condimentum mi. Integer sollicitudin gravida turpis sit amet tempor. Etiam facilisis faucibus mauris id fringilla. Ut a felis convallis, interdum nibh sit amet, accumsan elit. Nam ut erat felis. Maecenas lacinia felis pretium nibh consequat, sit amet iaculis turpis dictum. Aliquam pretium sollicitudin ligula vel vestibulum. Phasellus rhoncus magna vel lacus efficitur varius. Nunc a orci et sem consectetur elementum et sed lacus.
[/div][/div]
 
  • Like
Reactions: rissa
Status
Not open for further replies.
Top Bottom
Back