Loveless' Outlet Venue: Edits, Graphics and Code

[Loveless]

...Another banned person.

Anyways, hey guys I think I'm gonna pseudo-close the shop for a little while, my depression has been kicking my ass and I'm a bit behind on responses for things. Sooooo, you can still request things but I won't deliver them as quickly as before, might take me around a week or two instead.

Of course, if it's something urgent I may make an exception and tackle it as quick as possible, but yeah...

I'll open it back up full force once I clear my queue and reorganize myself. Thanks for understanding, see y'all around o/

[Link to the OP with all of the requesting details for easy travel]

 

[Loveless]

Is this still open for one of those fancy looking DIV code roleplay posts where you can scroll through the text without the need to scroll the website page?

Yus! We're always open~
So you like the hidden scrolls... Is there a layout you'd wish me to add them to, or is this a request from scratch? What's it that's on your mind? >w<

I was thinking about something simple like this one.

Obviously not exactly like that one. You can play with the colors to give the DIV some uniqueness? Don't use bright colors, though. They give me headaches. Here's the layout of the rest of the DIV box I want so desperate, but I'm sadly too stupid to understand coding:

FOR THE HEADER

Azrael Blackthorn
Time - | Weather - | Location -

---

​

I want the header to be exactly like this, with all those colors and fonts (the font name of the name is Permanent Marker, and the font name of the yellow text is Indie Flower). The picture is right there.

FOR THE BODY
Nothing that hard, really (yes, kind of funny because I'm here begging other person to do it for me. T vT I'm just that stupid with codes, okay!?). White text and with the Indie Flower font. And that's it. I would like to be able to color myself the dialogue of my character, though (I think I still can do this, but just pointing it out just in case).

A LITTLE EXTRA
Can you please add the small box at the bottom of that DIV box I sent as an example? That will be really nice. Just add the Mentions, and Interaction, and leave the Location as it will be already at the top.


That's it! This is everything I want, really? I will be really, really, REALLY thankful with you if you're able to do this for me. I've been trying, but with only failure. Please, help me!!! T vT b

Sounds simple enough! I'll work on this tomorrow~ Expect a ping whenever I'm done with it, though the fonts are not going to work in the preview for my lack of access to the google fonts feature... But I'll add them in the code for you either way ^^b

 

[Stray Shinku]

Thank you so much!

 

[Loveless]

@Shinku⭐Kun You can check the preview of your layout in this post in my private workshop, I'd post again but since fonts don't work either way I really don't see the point of doing that?

You didn't state anything about wanting borders, so I assumed you'd like it to remain minimal and did not add those, what I did, however, was take some liberties with it such as adding the second horizontal rule to mark where exactly the box starts and ends. Other things include the drop-shadow on the image (I thought it felt a bit flat without something to blend it into the bg), the bird icons by the infobox (I'd have used the eagle but it looked like a square due to the computer not being able to recognize non-unicode icons) and of course, the background itself. I went into his character sheet and the fact that he likes stargazing just spoke to me! Night skies are one of my favorite aesthetics, so I hope you like that as much as I did >w<

There's a second div right on top to darken the image a little, that way the white font would not clash too hard and could still be readable. The font is a setting on the div itself so anything you write inside it will default to white unless you add a color with the BBCode to it. This guarantees that no font will be automatically changing colors with the multiple Iwaku themes!

Anyway, I think this was everything I had to tell you about it, quite a fun and quick project! Let me know if you'd like anything added or altered and I'll get to it asap >w</

Thanks for visiting the shop~! <3

Code for Copy and Pasting

[div=background-image:url("https://images.unsplash.com/photo-1498590880827-3f79fdcd7fbe?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9"); background-size: cover; color: #FFFFFF; width: 100%;][div=background-color: rgba(0, 0, 0, 0.4); padding-bottom: 20px;]
[CENTER][div=filter: drop-shadow(8px 5px 13px black);][CENTER][IMG width="346px" alt="179964"]https://www.iwakuroleplay.com/attachments/1561951630235-png.179964/[/IMG][/CENTER][/div]
[font=Permanent Marker][COLOR=rgb(226, 80, 65)][U][SIZE=22px]Azrael Blackthorn[/SIZE][/U][/COLOR][/font]
[B][SIZE=15px][font=Indie Flower][COLOR=rgb(250, 197, 28)]Time[/COLOR] -[/font][/SIZE][/B][font=Indie Flower][SIZE=15px] [B]| [COLOR=rgb(250, 197, 28)]Weather[/COLOR][/B] - [B]| [COLOR=rgb(250, 197, 28)]Location[/COLOR] -[/B] [/SIZE][/font][/CENTER]
[hr][/hr]
[div=margin-left: 20px; margin-right: 20px; overflow: hidden; padding-bottom: 12px;][div=overflow-y: scroll; height: 470px; width: 101%; margin-left: 3.3%; padding: 12px 20px 0px 0px;][font=Indie Flower][Post body goes here][/font][/div][/div][div=margin-bottom: 20px;][hr][/hr][/div][div=height: 110px; width: 140px; padding: 10px 0px 10px 0px; margin: auto; border: 2px solid #CCC9C9;][CENTER][font=Indie Flower][PLAIN]🐦[/PLAIN] Interactions [PLAIN]🐦[/PLAIN]
[here]
[div=margin-top: 10px;][PLAIN]🐦[/PLAIN] Mentions [PLAIN]🐦[/PLAIN]
[here][/div][/font][/CENTER][/div][/div][/div]

 

[Stray Shinku]

OH MY GOD! IT WORKED LIKE A CHARM!

THANK YOU, THANK YOU, THANK YOU SOOOOOOOO MUCH! THIS IS WAY TOO PERFECT AND WENT BETTER THAN I EXPECTED!

Now, my friends won't scold me for not using a DIV box when posting novella posts! XD

You just saved me! Thanks again! You did such an amazing work that I will tell everyone! O vO b

 

[Loveless]

OH MY GOD! IT WORKED LIKE A CHARM!

THANK YOU, THANK YOU, THANK YOU SOOOOOOOO MUCH! THIS IS WAY TOO PERFECT AND WENT BETTER THAN I EXPECTED!

Now, my friends won't scold me for not using a DIV box when posting novella posts! XD

You just saved me! Thanks again! You did such an amazing work that I will tell everyone! O vO b

I'm glad! Hahahaha lol I see~, or you know, you could just be like me and assume it proudly ;3

Anyway, little joke aside, I'm happy that you like it that much! >w< \o/

 

[Stray Shinku]

Question, though. Does it usually take a lot of time for the DIV to load? My pages kind of freezes too. Maybe the background image s too big or something? I don't have this problem with other DIV boxes. Weird.

 

[Loveless]

Question, though. Does it usually take a lot of time for the DIV to load? My pages kind of freezes too. Maybe the background image s too big or something? I don't have this problem with other DIV boxes. Weird.

Ah, you're getting that too? I thought it was just my sucky computer being, my sucky computer (It likes freezing all the time, so I assumed it was just that). I'm going to try some things out real' quick and give you an updated image link soonish... Sorry about that, it's honestly a first for me! ^^'

 

[Loveless]

Question, though. Does it usually take a lot of time for the DIV to load? My pages kind of freezes too. Maybe the background image s too big or something? I don't have this problem with other DIV boxes. Weird.

[div=background-image:url("https://images.unsplash.com/photo-1498590880827-3f79fdcd7fbe?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1000&q=809"); background-size: cover; color: #FFFFFF; width: 100%;][div=background-color: rgba(0, 0, 0, 0.4); padding-bottom: 20px;]
[CENTER][div=filter: drop-shadow(8px 5px 13px black);][CENTER][IMG width="346px" alt="179964"]https://www.iwakuroleplay.com/attachments/1561951630235-png.179964/[/IMG][/CENTER][/div]
[font=Permanent Marker][COLOR=rgb(226, 80, 65)][U][SIZE=22px]Azrael Blackthorn[/SIZE][/U][/COLOR][/font]
[B][SIZE=15px][font=Indie Flower][COLOR=rgb(250, 197, 28)]Time[/COLOR] -[/font][/SIZE][/B][font=Indie Flower][SIZE=15px] [B]| [COLOR=rgb(250, 197, 28)]Weather[/COLOR][/B] - [B]| [COLOR=rgb(250, 197, 28)]Location[/COLOR] -[/B] [/SIZE][/font][/CENTER]
[hr][/hr]
[div=margin-left: 20px; margin-right: 20px; overflow: hidden; padding-bottom: 12px;][div=overflow-y: scroll; height: 470px; width: 101%; margin-left: 3.3%; padding: 12px 20px 0px 0px;][font=Indie Flower][Post body goes here][/font][/div][/div][div=margin-bottom: 20px;][hr][/hr][/div][div=height: 110px; width: 140px; padding: 10px 0px 10px 0px; margin: auto; border: 2px solid #CCC9C9;][CENTER][font=Indie Flower][PLAIN]🐦[/PLAIN] Interactions [PLAIN]🐦[/PLAIN]
[here]
[div=margin-top: 10px;][PLAIN]🐦[/PLAIN] Mentions [PLAIN]🐦[/PLAIN]
[here][/div][/font][/CENTER][/div][/div][/div]

Same code, same image, just a slightly different URL with a size input. I've been refreshing my page like crazy now and it seems to have eased up the loading times a lot with this change. Give it a try and let me know!

 

[Stray Shinku]

Yes! Everything's running smooth now. Thank you again! X3

 

[Loveless]

Yes! Everything's running smooth now. Thank you again! X3

No problem! o/ Sorry I didn't realize it earlier, guess I got used to freezing as just part of the course because of my sucky device XD
I should have suspected something was actually out of wack if the page itself was crashing lol : P
Lesson learned, big images are baaaad >3<

 

[Stray Shinku]

It has happened to me so many times that I just banned myself from looking at big images. It works so far! O vO b

 

[Sorrelfur]

Hello! I was wondering if you could make me a template of some sort? I'm looking for a template I can use for when I'm putting up like a partner search. Like sections for rules, about me, plots, and maybe two sections just named like 'filler' in case I need them.

Sorry for looking through your testing thread but I was thinking something like you "--Black and Gold CS: Seamus Alan Byrnes-- " template, with the tabs, ability to scroll, etc. But for a picture background of of these pictures;

1

2

3

4

5

Not too sure what color to make the part with the tabs and text but maybe white or something like that to look good with the background image? Hope this all makes sense and isn't too much to ask!

 

[Loveless]

Hello! I was wondering if you could make me a template of some sort? I'm looking for a template I can use for when I'm putting up like a partner search. Like sections for rules, about me, plots, and maybe two sections just named like 'filler' in case I need them.

Sorry for looking through your testing thread but I was thinking something like you "--Black and Gold CS: Seamus Alan Byrnes-- " template, with the tabs, ability to scroll, etc. But for a picture background of of these pictures;

1

View attachment 181517

2

View attachment 181518

3

View attachment 181519

4

View attachment 181520

5

View attachment 181521

Not too sure what color to make the part with the tabs and text but maybe white or something like that to look good with the background image? Hope this all makes sense and isn't too much to ask!

The tabs are a bit wonky as of now, as in, there's about 80px of space by the right that will not go away so it makes centring things a bit weird. Just a minor bug that I thought I should let you know of.

I can totally do you a layout though! Is the background supposed to change with the tabs or are these images just there for me to choose one?

You might also like to check my 1x1 layout, which is done similar, but with the tabs filling up the whole layout. Looks better even with the mild bug since I tweak the margins.

 

[Sorrelfur]

Hello! I was wondering if you could make me a template of some sort? I'm looking for a template I can use for when I'm putting up like a partner search. Like sections for rules, about me, plots, and maybe two sections just named like 'filler' in case I need them.

Sorry for looking through your testing thread but I was thinking something like you "--Black and Gold CS: Seamus Alan Byrnes-- " template, with the tabs, ability to scroll, etc. But for a picture background of of these pictures;

1

View attachment 181517

2

View attachment 181518

3

View attachment 181519

4

View attachment 181520

5

View attachment 181521

Not too sure what color to make the part with the tabs and text but maybe white or something like that to look good with the background image? Hope this all makes sense and isn't too much to ask!

The tabs are a bit wonky as of now, as in, there's about 80px of space by the right that will not go away so it makes centring things a bit weird. Just a minor bug that I thought I should let you know of.

I can totally do you a layout though! Is the background supposed to change with the tabs or are these images just there for me to choose one?

You might also like to check my 1x1 layout, which is done similar, but with the tabs filling up the whole layout. Looks better even with the mild bug since I tweak the margins.

Ah just one image for the whole thing, I don't care which one you pick I just gave alot of options because I know some picture look wonky when you try and make them bigger! :)

I'm sure I won't notice the centering issues but I wonder what's causing that? And that 1x1 layout is really nice too!! I'm not sure which layout I like better >_<

 

[Loveless]

Hello! I was wondering if you could make me a template of some sort? I'm looking for a template I can use for when I'm putting up like a partner search. Like sections for rules, about me, plots, and maybe two sections just named like 'filler' in case I need them.

Sorry for looking through your testing thread but I was thinking something like you "--Black and Gold CS: Seamus Alan Byrnes-- " template, with the tabs, ability to scroll, etc. But for a picture background of of these pictures;

1

View attachment 181517

2

View attachment 181518

3

View attachment 181519

4

View attachment 181520

5

View attachment 181521

Not too sure what color to make the part with the tabs and text but maybe white or something like that to look good with the background image? Hope this all makes sense and isn't too much to ask!

The tabs are a bit wonky as of now, as in, there's about 80px of space by the right that will not go away so it makes centring things a bit weird. Just a minor bug that I thought I should let you know of.

I can totally do you a layout though! Is the background supposed to change with the tabs or are these images just there for me to choose one?

You might also like to check my 1x1 layout, which is done similar, but with the tabs filling up the whole layout. Looks better even with the mild bug since I tweak the margins.

Ah just one image for the whole thing, I don't care which one you pick I just gave alot of options because I know some picture look wonky when you try and make them bigger! :)

I'm sure I won't notice the centering issues but I wonder what's causing that? And that 1x1 layout is really nice too!! I'm not sure which layout I like better >_<

I'm not sure either... Seems like the base code for tabs themselves has a margin on it set with a percentage (shrinking the tabs shrinks the margin), not anything me or other people can do about it tho (And I tried a bunch of things!), it's more about the CCS that's automated into the BBCode function, background stuff, something only staff can fix. Already reported it on their bug thread so it's all a matter of waiting now ^^' (A bit unfortunate, because I use tabs a lot so things look a bit wonky now... RIP the My Hero layout QAQ)

Well, the variations between one layout and the other aren't that big, so I could make one of each and let you pick which one you like the best, no problem! >w<

I'm a bit demotivated tonight though, lacking energy and such, will probably go to bed early, so I'll work on it tomorrow~
Be on the lookout for an update whenever that gets done!

 

[Sorrelfur]

That's weird that it got messed up, maybe one of the bug updates we had messed it up? Hopefully the staff can figure out what's causing it, but for right now it doesn't seem super bad at least!

Thanks so much for being willing to make a version of both of them!! You're so nice!!! I'll keep an eye out for updates :)

 

[Loveless]

@Sorrelfur HERE is a post in my workshop showcasing how these look like, I'll refer to them as Styles #01 and #02.
As you can see, the content is essentially the same, just presented in different ways~

And here are their codes:

Note that the hidden filler tabs will still show up if you have code inside them. If you'd like to preserve the tab without it showing up, you'll have to remove all content from inside them, including the BBCode.

Style #01

[DIV=background-image:url("https://www.iwakuroleplay.com/attachments/source-gif.181517/"); background-size: cover; padding: 10px 0px 30px 0px; color: white;]
[div=width: 70%; margin: auto; background: rgba(0, 0, 0, 0.5); border: double 4px white;][TABS][TAB=Rules][div=overflow: hidden;][div=overflow-y: scroll; height: 425px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=About Me][div=overflow: hidden;][div=overflow-y: scroll; height: 425px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=Plots][div=overflow: hidden;][div=overflow-y: scroll; height: 425px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=filler][div=overflow: hidden;][div=overflow-y: scroll; height: 425px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=filler][div=overflow: hidden;][div=overflow-y: scroll; height: 425px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB][/TABS][/div][/DIV]

Style #02

[DIV=border: 4px double white; width: 95%; margin: auto; height: 500px;][div=height: 100%; background-image:url("https://www.iwakuroleplay.com/attachments/source-gif.181517/"); background-repeat: no-repeat; background-size: cover; padding-top: 1px; color: white;][div=background-color: rgba(0, 0, 0, 0.5);][div=margin: -1px 0px 0px 80px;][TABS][TAB=Rules][div=overflow: hidden;][div=overflow-y: scroll; height: 410px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=About Me][div=overflow: hidden;][div=overflow-y: scroll; height: 410px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=Plots][div=overflow: hidden;][div=overflow-y: scroll; height: 410px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=filler][div=overflow: hidden;][div=overflow-y: scroll; height: 410px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB]
[TAB=filler][div=overflow: hidden;][div=overflow-y: scroll; height: 410px; width: 101%; margin-left: 3.3%; padding-right: 20px;]Your text here[/div][/div][/TAB][/TABS][/div][/div][/div][/div]

Sorry I'm a bit late, got reeeeally stuck with a post I was working on, so I did my best to get these done before bed >w<

Let me know if you'd like me to change/tweak/add anything! Background-size is set to cover, soooo it might look a bit stretchy on mobile to fit the boxes inside everything... Just a head's up since I didn't have time to test it out on there myself. Other options are with the background continuously repeating, or not-repeating at all, but then it would just cut when it ends, with the boxes sticking out of it (which is aesthetically hideous IMO).
All text inside the boxes is set to white unless stated otherwise by the usage of color tags.

Anyway, I think that was all I had to say about it. Oh! I liked the first image the most so, I didn't even try the other ones to be honest XD
It was just so preeetty~~ +O+

 

[Sorrelfur]

Omg they're both so gorgeous!!! You did a super super good job!! Like omggg xD I got so excited when I first saw them, you're a wizard at coding xD

I have to agree that first image fits so nicely! Thank you so so so much for making them for me! Theyre so perfect, both of them, I love the second slightly better but I love them both too haha

 

[Loveless]

Omg they're both so gorgeous!!! You did a super super good job!! Like omggg xD I got so excited when I first saw them, you're a wizard at coding xD

I have to agree that first image fits so nicely! Thank you so so so much for making them for me! Theyre so perfect, both of them, I love the second slightly better but I love them both too haha

Yay!! I'm glad you like them >w<
Hahahaha, omg wizard might be a bit too much, but I'll accept the compliment =^-^=

 

[Dark Country]

Hi! Can I request a photoshop edit?

I want the sword to look like its on fire; volcanic in nature like its made of stone and has red veins stretching down the core of the blade?