Chaturbate Codes for Bio

[Dan N]

Chaturbate Bio design Lavinia v3

Starting point for anyone who wants to use it and play with markup language
Full markup code :
- on jsfiddle.net
- on pastebin.com

Welcome editable text, 3 images, about me, room rules, tip menu with tip request and token amount, copyright box (optional) and sticky buttons.

Template also available on Camgirl Live Editor / Have fun and b creative
Dan N

 

[Leedsladlooking4]

Ok thank you very much I will try it and see how it works for me.thank you again

I do a bit of bio design on chaturbate, if you need one making for you, I'd be happy to help https://www.chaturbate.com/leedsladlooking4

 

[Natalie_Lavender]

This will do?
Code

<p style="display:block;width:35px;height:auto;text-align:center;position:fixed;top:160px;left:0;"><a href="your-amazon-link"><img src="https://editbio.files.wordpress.com/2016/09/01_ama.png" style="display:block;width:35px;height:auto;margin:0 auto;"/></a>

Will render this image

Add your amazon link between those double quotes.
If you wanna change the icon... here are some alternatives to choose from

https://editbio.files.wordpress.com/2016/09/06_ama.png

https://editbio.files.wordpress.com/2016/09/2ama.png

https://editbio.files.wordpress.com/2016/09/1ic_ama.png

https://camgirlbioeditor.files.wordpress.com/2016/11/icr_ama.png

https://camgirlbioeditor.files.wordpress.com/2016/11/icbg_ama.png

https://editbio.files.wordpress.com/2016/11/icp_ama.png

https://editbio.files.wordpress.com/2016/11/ic_amazon.jpg

Change the image width attribute as you see fit... I usually use 35px width as I don't want to overlap other elements.

Thank you, thank you, thank you!!...for this!!

 

[KittyPride69]

Hello So I’ve heard that Canva is a good place to make a CB bio...Unfortunately I can’t get it to work. I made a bio design that I love but when I use the HTML code Canva gives me, it doesn’t show up on CB. It shows up as a link that takes you to the Canva page with my design on it instead of just showing my design in the “about me” section.
Is there extra code I should be adding to the code Canva gives??

I'm pretty sure you can save Canva as jpg and just upload it like an image for html

 

[Donniered]

hi im new to chaturbate. my question is what code do i use to make my about me section transparent so that i can see my background image. also will it work if i use a canvas file or wil the canvas just be pushed to the bottom?

 

[NotYou]

hi im new to chaturbate. my question is what code do i use to make my about me section transparent so that i can see my background image. also will it work if i use a canvas file or wil the canvas just be pushed to the bottom?

What are you using to overlay the background image? I mean, are you using an image and placing it on top? If so the you'd best set the transparency on the layer in your design software.
If you're using code you could simply use this in the style part:

background-color: rgba(255, 255, 255, .4);


Change the .4 to anything you want - 1.0 will be 100% and 0 is full transparency.

 

[Donniered]

What are you using to overlay the background image? I mean, are you using an image and placing it on top? If so the you'd best set the transparency on the layer in your design software.
If you're using code you could simply use this in the style part:

background-color: rgba(255, 255, 255, .4);


Change the .4 to anything you want - 1.0 will be 100% and 0 is full transparency.

I want using

What are you using to overlay the background image? I mean, are you using an image and placing it on top? If so the you'd best set the transparency on the layer in your design software.
If you're using code you could simply use this in the style part:

background-color: rgba(255, 255, 255, .4);


Change the .4 to anything you want - 1.0 will be 100% and 0 is full transparency.

I'm using canvas. If a set the opacity low will it see straight through to the red background that I place behind the page or will it just be the white about me window? https://chaturbate.com/p/donniered/?tab=bio

 

[NotYou]

I want using

I'm using canvas. If a set the opacity low will it see straight through to the red background that I place behind the page or will it just be the white about me window? https://chaturbate.com/p/donniered/?tab=bio

Your room has a password.

 

[Donniered]

Your room has a password.

Lol damnit try now

 

[NotYou]

You basically have the code there already waiting you just need a few additions...
At the top you have this in a <ul style="">

display:block;width:100%;height:auto;margin:10px auto 20px auto;padding:20px;background-color:rgba(255,255,255,0.4);background-image:url();background-position:0 0;background-repeat:repeat;

Ad your background URL into the bit where I have highlighted red and then use the same settings you have used for your full background:

display:block;width:100%;height:auto;margin:10px auto 20px auto;padding:20px;background-color:rgba(255,255,255,0.4);background-image:url(https://camo.stream.highwebmedia.co...f6164732f323031372f31322f6261636b342e706e67);background-repeat:repeat;background-size:auto;-webkit-background-size:auto;background-position:0 0;background-attachment:fixed;

So that is what your style should look like for that first <ul style="">
Add opacity to any image tag by adding simply style="opacity: 0.5;"
Of course that will also effect the text on the image so may not be as readable but that's up to you to decide.

Your images look like they have slight opacity anyway so maybe you don't need that.

 

[Donniered]

You basically have the code there already waiting you just need a few additions...
At the top you have this in a <ul style="">

display:block;width:100%;height:auto;margin:10px auto 20px auto;padding:20px;background-color:rgba(255,255,255,0.4);background-image:url();background-position:0 0;background-repeat:repeat;

Ad your background URL into the bit where I have highlighted red and then use the same settings you have used for your full background:

display:block;width:100%;height:auto;margin:10px auto 20px auto;padding:20px;background-color:rgba(255,255,255,0.4);background-image:url(https://camo.stream.highwebmedia.co...f6164732f323031372f31322f6261636b342e706e67);background-repeat:repeat;background-size:auto;-webkit-background-size:auto;background-position:0 0;background-attachment:fixed;

So that is what your style should look like for that first <ul style="">
Add opacity to any image tag by adding simply style="opacity: 0.5;"
Of course that will also effect the text on the image so may not be as readable but that's up to you to decide.

Your images look like they have slight opacity anyway so maybe you don't need that.

Thank you

 

[xjarheadxxx]

There are two options you can play with.
First option is to replace an existing image (service icon) with other image, for example, if you want to use kik instead of Manyvids, just replace the Manyvids (existing icon/image) with Kik one.

The second option is to duplicate the code for an icon, change the icon and add your link.

For gift cards, same process... if you have something else in mind and I did not provided expected answer, feel free to let me know, I'm open to suggestions.
Best of luck

Hey Dan,
Im trying to set a background for Chaturbate and wanted to see if you/anyone could help me out? I want a certain background that i have a picture of and Im just wondering how do i set this up and make it my background on both the background and the "about me" background where my pictures and info abuot my room is located.
Also do you know any codes for amazon & twitter floaters that i can put on the left side of my video while camming?
BTW i just registered today so it won't let me pm you.

Thanks in advance!

 

[Dan N]

Hey Dan,
Im trying to set a background for Chaturbate and wanted to see if you/anyone could help me out? I want a certain background that i have a picture of and Im just wondering how do i set this up and make it my background on both the background and the "about me" background where my pictures and info abuot my room is located.
Also do you know any codes for amazon & twitter floaters that i can put on the left side of my video while camming?
BTW i just registered today so it won't let me pm you.

Thanks in advance!

Hi @xjarheadxxx , the ACF forum has the answers to your questions and I know its time consuming to search trough so many pages even if the forum is well structured (and also has a search form)

Full page background image:

<p id="main" style="display:block;width:100%!important;min-height:2000px;height:100%!important;z-index:-55;position:fixed;top:0;left:0;background-color:#93C;background-image:url(https://editbio.files.wordpress.com/2016/06/second_bg.png);background-repeat:repeat;background-size:cover;-webkit-background-size:cover;background-position:center;background-attachment:fixed;"></p>

replace current background image, the full URL path with your own hosted image

Sticky icons / floating icons for social media visible in the left margin of the bio page

<li style="display:block;width:40px;height:auto;position:fixed;top:166px;left:0px;text-align:center;list-style:none;box-sizing: border-box;padding:8px 0 10px;"><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#4b7aaa;"></a><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/1ama.png" style="width:35px;height:35px;background-color:#4b7aaa"></a><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2insta.png" style="width:35px;height:35px;background-color:#4b7aaa"></a><a href="#" style="display:block;width:35px;height:300px;background-color:#000"><img src="https://raw.githubusercontent.com/cssmfc/xniteproductions/master/assets/images/buttons/clte_acre_blkanim.gif" style="width:35px;height:300px;"></a></li>

replace the icons as you and don't forget to add your own links - another demo online

 

[itsfaye]

https://www.sololearn.com/ has been super helpful to learn the basics of html which helped me understand a lot of this better

 

[ledgealot]

Hey Dan, I could really use your help. On one profile (sadly can't remember the username, so I can't provide the link to show exactly what I mean) I saw an image in the bio section, and the image was stationary - when scrolling down the bio, its position stayed fixed in the background. I've been trying to find a way to do that, but I'm a total noob when it comes to any html coding, so I don't even know which code I am actually looking for. I'd like to have a certain image set in the background like that, and then use additional images where I would write all the stuff (rules, tip menu and so on) on top of it. Hopefully I described it clearly enough, please help me, I'd really appreciate it.

 

[itsfaye]

Hey Dan, I could really use your help. On one profile (sadly can't remember the username, so I can't provide the link to show exactly what I mean) I saw an image in the bio section, and the image was stationary - when scrolling down the bio, its position stayed fixed in the background. I've been trying to find a way to do that, but I'm a total noob when it comes to any html coding, so I don't even know which code I am actually looking for. I'd like to have a certain image set in the background like that, and then use additional images where I would write all the stuff (rules, tip menu and so on) on top of it. Hopefully I described it clearly enough, please help me, I'd really appreciate it.

Something like this?
<ul style='overflow:auto; width:500px; height:200px; margin:auto; padding:2%; border:solid red 5px; background:green; font-size:20px'>outer box

<br>outer box

<br>outer box

<ul style='overflow:auto; width:400px; height:100px; margin:auto; padding:5%; border:solid blue 5px; background:yellow; font-size:20px;'>inner box

<br>inner box

<br>inner box

<br>inner box

<br>inner box

<br>inner box

</ul>

<br>outer box

<br>outer box

<br>outer box

</ul>

 

[itsfaye]

(Someone on another thread or something posted that code, i can't remember who)

 

[ledgealot]

no, that's not it, but thankfully I've found someone who's bio can show exactly what I mean, here it is: https://chaturbate.com/roccoblack02/ (I hope it's not against some rules to post room links here, I created the account in a hurry)

The way he has that brick wall in the background of the whole "About me" section - how do I do that, and put images over it like he did?

edit: I realized the pictures were probably just added the simple way with a link? If so, I know how to do that, I just don't know how to fill the whole background with an image of my choice.

 

[Dan N]

Hey Dan, I could really use your help. On one profile (sadly can't remember the username, so I can't provide the link to show exactly what I mean) I saw an image in the bio section, and the image was stationary - when scrolling down the bio, its position stayed fixed in the background. I've been trying to find a way to do that, but I'm a total noob when it comes to any html coding, so I don't even know which code I am actually looking for. I'd like to have a certain image set in the background like that, and then use additional images where I would write all the stuff (rules, tip menu and so on) on top of it. Hopefully I described it clearly enough, please help me, I'd really appreciate it.

Already replied to a similar question but I will do it again.
Here's the markup code which is using a fixed background image and static elements.
https://jsfiddle.net/cle_dan/ujav378b/
Get some inspiration from markup code and you'll be able to develop more. Good luck

 

[ledgealot]

Already replied to a similar question but I will do it again.
Here's the markup code which is using a fixed background image and static elements.
https://jsfiddle.net/cle_dan/ujav378b/
Get some inspiration from markup code and you'll be able to develop more. Good luck

Thank you so much! That's precisely what I wanted, and even more! )

 

[Blu Violet]

A fresh, clean, easy to edit Chaturbate Bio design .
Posted as a pen here https://codepen.io/cssmfcpro/pen/jYVbqZ

If guys from codepen removes the pen as it is not exactly for all ages
Here's the jsfiddle version https://jsfiddle.net/cle_dan/etj9kv7z/

Feel free to make it yours, credits can be removed, replace default content and add your own links.
Compatible with Camgirl Live Editor (but this particular design is not posted on CLE)
Happy Holidays from CLE team

A fresh, clean, easy to edit Chaturbate Bio design .
Posted as a pen here https://codepen.io/cssmfcpro/pen/jYVbqZ

If guys from codepen removes the pen as it is not exactly for all ages
Here's the jsfiddle version https://jsfiddle.net/cle_dan/etj9kv7z/

Feel free to make it yours, credits can be removed, replace default content and add your own links.
Compatible with Camgirl Live Editor (but this particular design is not posted on CLE)
Happy Holidays from CLE team

Hey Dan and CLE team... I'd like to use this bio but I'd like to remove the image and ad my own where would I copy in my HTML to do so?

 

[melezouriou]

Hey Dan and CLE team... I'd like to use this bio but I'd like to remove the image and ad my own where would I copy in my HTML to do so?

The image in the bio template is following in code:

https://raw.githubusercontent.com/cssmfc/xniteproductions/master/assets/bootstrap/thumbs/pic07.jpg

Just replace that link with the link to your chosen image.

 

[CoppertoneButt]

Already replied to a similar question but I will do it again.
Here's the markup code which is using a fixed background image and static elements.
https://jsfiddle.net/cle_dan/ujav378b/
Get some inspiration from markup code and you'll be able to develop more. Good luck

So dan i know its a easy thing im just NOT SEEING BUT I HAD NO IDEA HOW TO CONTACT YOU so i justed on the comments to this persons(sorry bout that) so i cant find where to put the image url for the CB bio design i got from codepen

 

[Dan N]

So dan i know its a easy thing im just NOT SEEING BUT I HAD NO IDEA HOW TO CONTACT YOU so i justed on the comments to this persons(sorry bout that) so i cant find where to put the image url for the CB bio design i got from codepen

replace this https://raw.githubusercontent.com/cssmfc/xniteproductions/master/assets/bootstrap/thumbs/pic07.jpg with your image url between double quotes.
As for contacting.... I can be reached via ACF PM, Twitter, website contact form ....

 

[Dan N]

Source Editor.
A very simple source and editing tool to help you customize your Chaturbate bio code.


You can paste your chaturbate code inside the dark-grey box and edit it manually.
The Preview button will render the code as seen on your Chaturbate bio page.
You can upload a full web page, edit, preview and save it on your pc/laptop

This tool is a simple web page, runs locally, no external resources, no additional libraries.
It is simply showing the source of a local web page or markup code, allows you to edit it and save it.
Supports .html, .php,.txt / css, html, javascript.... the same stuff supported by your browser.
I've developed this "tool" (web page) because some of you have difficulties in editing the source code of your CB bios (or code snippets) manually .
Now you can see both the code, the preview and also save your editing process.

A rough development but nevertheless useful for those who are willing to embrace the idea of DIY - and "Damn... I did this! "
Source Editor is available on GitHub for free download and use.

 

[CurvyJ]

I know its been asked a million times but for some reason Im having issues, would anyone be able to share the floating twitter button that will post my link on the side of my stream? Ive been having issues with finding it and I accidentally deleted the code when I tried to take out the many vids/amazon link... Would love just a twitter button... with a possible purple icon if anyone can help?

 

[Dan N]

I know its been asked a million times but for some reason Im having issues, would anyone be able to share the floating twitter button that will post my link on the side of my stream? Ive been having issues with finding it and I accidentally deleted the code when I tried to take out the many vids/amazon link... Would love just a twitter button... with a possible purple icon if anyone can help?

a set on jsfiddle

now stripping all the rest of the icons, leaving only twitter

<li style="display:block;width:40px;height:auto;position:fixed;top:166px;left:0px;text-align:center;list-style:none;box-sizing: border-box;text-align:center;z-index:10000;overflow:hidden;float:none;clear:left;"><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#a32ce8;"></a></li>

Tweek tips:
- change the #a32ce8 at the very end if you want to change the color
- replace the full image path between double quotes with your own hosted image if you want to change the twitter icon
https://editbio.files.wordpress.com/2016/09/2twt.png

 

[CurvyJ]

a set on jsfiddle

now stripping all the rest of the icons, leaving only twitter

<li style="display:block;width:40px;height:auto;position:fixed;top:166px;left:0px;text-align:center;list-style:none;box-sizing: border-box;text-align:center;z-index:10000;overflow:hidden;float:none;clear:left;"><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#a32ce8;"></a></li>

Tweek tips:
- change the #a32ce8 at the very end if you want to change the color
- replace the full image path between double quotes with your own hosted image if you want to change the twitter icon
https://editbio.files.wordpress.com/2016/09/2twt.png

Thank you so so so much So ive copied and pasted it works fine...but will only let me use 1 is there a way to be able to have 2 floating buttons for twitter? Mine and my husbands? Or can I only use the code once

 

[Dan N]

Thank you so so so much So ive copied and pasted it works fine...but will only let me use 1 is there a way to be able to have 2 floating buttons for twitter? Mine and my husbands? Or can I only use the code once

From your topic I've understand that you need only one Twitter button...

Here's the markup code for two

<li style="display:block;width:40px;height:auto;position:fixed;top:166px;left:0px;text-align:center;list-style:none;box-sizing: border-box;text-align:center;z-index:10000;overflow:hidden;float:none;clear:left;"><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#a32ce8;"></a><a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#a32ce8;"></a></li>

Simple way is to copy and paste the markup code for the single twitter icon and paste it again.... you can add more icons in the same way. Copy/paste.
This is the reference markup code for a single twitter icon.

<a href="#" style="display:block;width:35px;height:35px;border-bottom:1px solid #333;"><img src="https://editbio.files.wordpress.com/2016/09/2twt.png" style="width:35px;height:35px;background-color:#a32ce8;"></a>

Make sure you don't leave empty spaces between code segments so CB doesn't interpret them as <br> tags

 

[christinatarrr]

hello I need some help I guy made me a background and it messed up my chaturbate and now I cant even edit my profile. can someone get back to me. if u see the pic I added that image is over the page and won't allow me to click on anything