HOME | DD
SimplySilent β Awkward Speech Bubble
Published: 2013-07-25 21:28:03 +0000 UTC; Views: 59258; Favourites: 3137; Downloads: 81
Redirect to original
Description
I was inspired by `CypherVisor to try and create custom box resources, so here's another one!
Here's a little speech bubble I found that you can use as an awkward bubble or an even more awkward content box.
Update: The code below will align your speech bubble to the left. To align to the right side, delete the
Speech Bubble Above Icon/Content Box
Paste the following right before the icon or content box:
Speech Bubble within Content Box
The code for a content box normally looks like this:
Right before the Content Box Text, insert the speech bubble code from above like so (underlined text is the inserted speech bubble code):
Awkward Content Box
The code is the same as a regular speech bubble, but you must include line breaks so that your text doesn't go off the widget.
More Resources
Check out more Custom Box Resources by `CypherVisor
Also see his Custom Box + Journal Tips n Tricks for more help.
Related content
Comments: 152
Using! This is very helpful!
Although, I do have one concern. When I tried to add more than one icon to the bubble, it glitched and looked odd. I'm not sure if I just exceeded the limit or not. ^^'
π: 0 β©: 0
Many thanks for this find. The color matches my format really well.
My only confusion is how you managed to place in an icon without a space above it like mine?
I had to grab invisible unicode ( ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώ ο»Ώο»Ώ) to even get the image to appear without text.
If I can't find an answer I guess I'll have to measure out the pixel height and extend the actual images canvas to match
I did a lot of experimentation and realized just how bizarrely this box functions. It's like half content box half... mysterious and fickle code.
Sadly I lost the coding but I managed to send an image to the border of the widget without the speech box visible.
Basically using this as a roundabout way to nudge an image way past the context box. Very odd.
π: 0 β©: 0
Is there a way for the speech bubble to be coming from the opposite side?
π: 0 β©: 0
How do I add an image into the awkward content box? Im using the but it isn't working. Is there a size limit?
π: 0 β©: 0
The only problem im having is the little arrow that signifies that the person is speaking isnt there, its just a rounded box!
π: 0 β©: 0
Black custom Box with Grey- White Box Β there are plenty more if you want a different one
π: 0 β©: 1
this one's perfectly fine I just don't understand the codingΒ
π: 0 β©: 1
Oh. I'm really not that good at explaining. Sorry but I can't really help you there.Β
π: 0 β©: 1
it's ok thanks anyways
π: 0 β©: 0
I can't figure out the "awkward context box" code.
Can somebody help me?
EDIT: Nevermind, I got it! :'D
π: 0 β©: 0
what custom box is this? the blue one? i'm in love with it ;o;
π: 0 β©: 0
I'm having trouble with coding so that my icon hovers over my context box.
Could I please have some help?
π: 0 β©: 0
I'm trying to put in an icon and it's not working could someone help?
π: 0 β©: 1
: iconenekagerou: without the space, or if any other user : icon[USER]:
π: 0 β©: 1
Like this?
When i do that it doesn't seem it to work at all
π: 0 β©: 1
Oh, I'm not really sure then. it might be where you place it- in that case it'd be right after the CSS.
π: 0 β©: 1
Well thanks for helping anyway!
π: 0 β©: 1
Does this coding no longer work? Cause I've tried putting this in a custom widget on my profile page and all that shows up is the awkward speech bubble, the content box along with the text doesn't even show up :/
π: 0 β©: 1
If you still need this question answered, yes, it does! I just applied it to my own page before seeing your comment. C: However, not sure what's wrong with yours though?Β
π: 0 β©: 0
Hello, I'm trying to recreate the third example in the picture and I'm rather confused with how it works or if I'm even doing the coding correctly? I keep trying but it only ends up looking like this;Β Screen Shot 2015-12-16 at 8.19.32 PM Β .Β
π: 0 β©: 0
ah its not working for me, when i paste it in my context box the bubble doesn't even appear :c
π: 0 β©: 0
Is there anyway to flip the triangle part on this so it's pointing the other direction?Β
π: 0 β©: 1
Nope. It's all hard-coded into the CSS by DeviantART, so all we can do is find it and use it, but not change it.
π: 0 β©: 1
Ahh dang it xD Oh well.. Thank you!~
π: 0 β©: 0
im so confused! can you please help clarify?
π: 0 β©: 0
How do you do the awkward Β context bo without the triangle ;;A;; i tried everything but nothing worked
π: 0 β©: 0
My content box ate it ROFL xD Saw the update after fixing it from being eaten by my content box, thank you ;u;
π: 0 β©: 0
I dont see how people are having issues with this, its fairly easy and quick to do.
π: 0 β©: 0
Someone please help. Im trying to get the icon over the custom box result but the directions are confusing.
π: 0 β©: 0
the only problem i have this, is that whenever i try any of these, it works BUT
my custom box is OVER the icon / speech bubble.
any help??
π: 0 β©: 1
Space them from each other, fixed mine ;y; Press enter twice at the end of the speech bubble if at the top. Enter twice at the end of the content things if at the end of the box. Hope this helps if you still need it <3
π: 0 β©: 0
< div align="center">
remove the space, and align your text !! for example,
< div align="center">get your body over here, body text.< /div>
^^^ remove the spaces
π: 0 β©: 0
Can someone please help me with this? >n<
π: 0 β©: 1
Unfortunately, I think you can only use it if you're a premium member, sorry!!
π: 0 β©: 1
Oh I was the other day.
It just expired. But thanks for that information!
π: 0 β©: 1
Oh. Sorry for the misunderstanding then quq
You're welcome!!
π: 0 β©: 0
I tried putting :iconMYUSERNAME : after the bubble.
π: 0 β©: 0
| Next =>