Adding Images to Your Chaturbate Bio - Coding!

Jessi J · Jan 20, 2013

Chaturbate had made adding images pretty complicated and I know not every model has access to the Model's Only Section (where there is a lot of awesome information!) so I thought I would add this here since so many people were having issues with it.

If you want to add images to your bio, here's the coding:

Code:

<img style="height:HEIGHT;width:WIDTH;background:COLOR" src="//IMAGE ADDRESS"/>

To make it work properly, you need to remove the http: part of the URL.

If you want to make an image 'clickable' then you need to do this:

Code:

<a href="//websiteurl.com" target="_blank"><img src="//image.jpg"/></a>

This way you can make an image to something like Twitter, then make it an image that can be clicked and transfers the person to the website of you choice, i.e. twitter.

It is pretty simple once you know the code, but just remember somethings are not allowed on Chaturbate, such as you own website or promotion of your other camsites/websites.

Vicky Vixxx · Feb 21, 2013

is there anyway to "align" all the graphics to the middle? I tried a few different codes, nothing seems to work this is the code im using for my graphics now

<img src="//WEBSITE.jpg"/>

LoonaVision · Jun 16, 2015

How can i add anything like this to chaturbate?

MiniatureKiwi · Jun 18, 2015

Hi Loona,

You would need to use CSS styling in HTML tags to do that.

CSS styling allows you to style specific content on a web page. Normally you would style a website in the <head> </head> section (which you do not have access to with Chaturbate) so you need to do it as an inline style.

First, you will need to find images you would like to use. Second, you will need to use inline CSS and some HTML coding.

Let's say you want Amazon, Twitter, and Facebook icons to be lined up under your cam stream from left to right. You would use:

Code:

<p style=“position:fixed; top:250px; left:20px;”><a href=“LINK TO YOUR AMAZON”><img src=“LINK TO AMAZON ICON”></a>
<a href=“LINK TO YOUR TWITTER”><img src=“LINK TO TWITTER ICON”></a>
<a href=“LINK TO YOUR FACEBOOK”><img src=“LINK TO FACEBOOK ICON”></a>
</p>

In the above, the inline CSS is part of the or "paragraph" tag. Since it is part of the tag, anything within that tag, so all those images (which are linked by the <a> tag), would relate to that style. In this example, it would push the paragraph 250 pixels down from the top of the page, and push the paragraph 20 pixels right from the left of the page. You would need to edit the spacing appropriately based on how many images you have and where exactly you want it.

You can change the above example to line them up top to bottom, by putting the inline CSS style in each of the <img> tags, rather than the tag, and use a different pixel amount for the top. It would look like:

Code:

<p><a href=“LINK TO YOUR AMAZON”><img style="position:fixed; top:250px; left:20px;" src=“LINK TO AMAZON ICON”></a>
<a href=“LINK TO YOUR TWITTER”><img style="position:fixed; top:270px; left:20px;" src=“LINK TO TWITTER ICON”></a>
<a href=“LINK TO YOUR FACEBOOK”><img style="position:fixed; top:290px; left:20px;" src=“LINK TO FACEBOOK ICON”></a>
</p>

Let me know if you have any further questions.

Jentis · Sep 30, 2015

I will borrow this thread for a question, how can i make a background picture on my Chaturbate profile? I have tried it all and can't make it work + chaturbate don't allow CSS. Thanks in advance

Devinsaint · Dec 9, 2015

Please help me I can't get the code to work!!!

lovelicks69 · Jan 2, 2016

Don't worry it took me a month to figure it all out...google inline css. You need to use html tags with inline css to get things to be styled and line up how you want them. I'm working on a basic template that I hope to be able to pass on to those getting a bit stuck.

murphy gooden · Feb 9, 2016

con you till me how do i make my
Chaturbate bio ork

Avaknoxx · Feb 12, 2016

Jentis said:
I will borrow this thread for a question, how can i make a background picture on my Chaturbate profile? I have tried it all and can't make it work + chaturbate don't allow CSS. Thanks in advance

Here's the code that I used for my background, hope this helps. Just replace the http://.... with the url for your background image

Code:

<p target="_blank" style="background:url(http://i328.photobucket.com/albums/l347/avaknoxx/background_zpsii2fbxbv.jpg~original);width:2000px;height:2000px;left:0px;top:0px;position:fixed;z-index:-100;" rel="nofollow"></p>

Krystal Orchid · Feb 29, 2016

Avaknoxx said:
Here's the code that I used for my background, hope this helps. Just replace the http://.... with the url for your background image

Code:

<p target="_blank" style="background:url(http://i328.photobucket.com/albums/l347/avaknoxx/background_zpsii2fbxbv.jpg~original);width:2000px;height:2000px;left:0px;top:0px;position:fixed;z-index:-100;" rel="nofollow">

YESSSS. I've been dying to figure out the code for that background level FOREVER. Thank you so much for sharing this Avaknoxx!

Mizzami · Mar 11, 2016

I see models with GIFs in their profile graphic (like.. those pretty, long pictures that have a lot of info?) and the GIFs are centered in the image and such.. how is that possible? I would love to be able to do that but I'm not sure if I can in GIMP. Do they make it like a .png and then drag a gif into the spot they want it to be in, then save as a gif/

WebcamStartup · Mar 11, 2016

missbabydolly said:
I see models with GIFs in their profile graphic (like.. those pretty, long pictures that have a lot of info?) and the GIFs are centered in the image and such.. how is that possible? I would love to be able to do that but I'm not sure if I can in GIMP. Do they make it like a .png and then drag a gif into the spot they want it to be in, then save as a gif/

Should be as simple as uploading the GIF image and adding the HTML. Share a URL to a CB Chatroom featuring something like this and I'll take a look at the source code. Either that, or you can check it out yourself by right clicking on the Chaturbate page, hitting View Source or however they word it in your particular browser and scrolling down.

Mizzami · Mar 11, 2016

WebcamStartup said:
Should be as simple as uploading the GIF image and adding the HTML. Share a URL to a CB Chatroom featuring something like this and I'll take a look at the source code. Either that, or you can check it out yourself by right clicking on the Chaturbate page, hitting View Source or however they word it in your particular browser and scrolling down.

Yeah, I know about adding HTML and such, I used to be able to code my own websites.
I just went back to the girl's profile and now I see that it's a separate image code and she's just used the same width for each photo and background colour so it connects seamlessly!
Thanks though

CamHarlot · May 28, 2016

For the life of me I cannot get this code to work tbh...

Jennifer Miller · Jun 17, 2016

Avaknoxx said:
Here's the code that I used for my background, hope this helps. Just replace the http://.... with the url for your background image

Code:

<p target="_blank" style="background:url(http://i328.photobucket.com/albums/l347/avaknoxx/background_zpsii2fbxbv.jpg~original);width:2000px;height:2000px;left:0px;top:0px;position:fixed;z-index:-100;" rel="nofollow">

How do i make the background image transparent ? fixed transparent? the white part of the bio is what im asking how to put a fixed background on that? i have the border background thank you so much but the whole background under the information part of the bio? not sure if im making this understandable.

Randi · Nov 25, 2016

Thank you! I was wondering how some models got that background dealt with, it makes your page that much nicer. I copied, pasted and changed Ava's background code and viola! nice background in 30 seconds.

Sal · Nov 27, 2016

I think that I understand, but where do I add the CSS text?

Ashlyn_x · Dec 9, 2016

Does anyone have a website for a manyvids icon?

andreasky · Dec 9, 2016

http://i1299.photobucket.com/albums/ag73/susieqxxx/Icon-ManyVids_zpsqtrbtnpc.png

https://d3e1078hs60k37.cloudfront.net/site_files/images/manymotes-v2/items/items16.svg

I googled manyvids icon

Dan N · Dec 10, 2016

The code which is a bit wrong.
target="blank" attribute it is used only for links and not in paragraph tags same as rel="nofollow" . nofollow informs the crawler bot who indexes an web page not to follow the link -- do not digg deeper. It has no place in paragraph tags
it should be like this

HTML:

<p style="background-image:url(http://i328.photobucket.com/albums/l347/avaknoxx/background_zpsii2fbxbv.jpg);background-size:auto;background-repeat:repeat;width:2000px;height:2000px;left:0px;top:0px;position:fixed;z-index:-100;"></p>

I'm just trying to help here.... nothing else. The background image must end with image extension like .gif .png or .jpg and not other backslash or any other characters if it ends with .html is not going to work. The html extension suggests a web page and not an image.

@andreasky the second image is SVG format and it is not recommended

Dan N · Dec 10, 2016

Ashlyn_x said:
Does anyone have a website for a manyvids icon?

Does this help?
http://camgirl.xniteproductions.com/cb-profiler/graphic-corner/icons/

@Sal - inline CSS only - Chaturbate doesn't allow import method or additional enclosed css styles
<style> </style> <- will not work
@import <- will not work

If I am to help further I'll get banned from forum... to many consecutive replies

frostcity · Dec 14, 2016

try this one, only replace with the links of your choice, or keep the ones on it.

<ul target="_blank" style="border:4px background-attachment:fixed;background-image: url(https://wallpaperscraft.com/image/b..._1920x1080.jpg);background-attachment:static; background-repeat:no-repeat background-size:cover;;background-position:0em 0px;margin-left: -10em; margin-right: -10; margin-top:0em; " rel="nofollow"> <p style="border: none; background:none; background-image:none; background-position:center top ;width: 96%; padding: 0px;border-radius: 3px; margin-top:0em; ;margin-right: auto; margin-right:auto; text-align: center; text-shadow: 0 0 2px#ffffff, 0 0 5px#ffffff, 0 0 20px #ffffff; font-size:20px; line-height: 20px; font-family

oster;" target="_blank" rel="nofollow">

<p style="background:url(https://wallpaperscraft.com/image/b...plosion_burst_9844_1920x1080.jpg);width:100%; height:100%; left:0px; top:0; background-repeat: repeat; background-attachment: scroll; background-position: left 70%; background-size: 100% 200%; position: fixed; z-index: -100" target="_blank" rel="nofollow"> </ul></ul></ul>

uncoveredmanhole · Feb 14, 2017

Jessi J said:
Chaturbate had made adding images pretty complicated
...

Code:

<img style="height:HEIGHT;width:WIDTH;background:COLOR" src="//IMAGE ADDRESS"/>

To make it work properly, you need to remove the http: part of the URL.

hey just wanted to say thanks for this thread. had to google chaturbate specifically after fruitless HTML efforts and found this

but FWIW it only worked if I left in the http://

feathersoflace · May 20, 2017

Jessi J said:
Chaturbate had made adding images pretty complicated and I know not every model has access to the Model's Only Section (where there is a lot of awesome information!) so I thought I would add this here since so many people were having issues with it.

If you want to add images to your bio, here's the coding:

Code:

<img style="height:HEIGHT;width:WIDTH;background:COLOR" src="//IMAGE ADDRESS"/>

To make it work properly, you need to remove the http: part of the URL.

If you want to make an image 'clickable' then you need to do this:

Code:

<a href="//websiteurl.com" target="_blank"><img src="//image.jpg"/></a>

This way you can make an image to something like Twitter, then make it an image that can be clicked and transfers the person to the website of you choice, i.e. twitter.

It is pretty simple once you know the code, but just remember somethings are not allowed on Chaturbate, such as you own website or promotion of your other camsites/websites.

I want to make my bio into a bubble image backdrop with cursive lettering but I can't figure it out for the life of me. Any help please!!!

Dan N · May 21, 2017

feathersoflace said:
I want to make my bio into a bubble image backdrop with cursive lettering but I can't figure it out for the life of me. Any help please!!!

Two choices.
First one, you will need the "bubble" image and set it as background. On top of the image add another editable content and add your text.
The second version is images based. Create both the bubble graphic and text in a single image after that, upload your image online and add it to your CB bio
A fast sample

Kyothegreat · Sep 1, 2017

ive been trying various code options to get an image into my Bio with no luck......can anyone tell me what is wrong with this code?

<a href="http://tinypic.com?ref=nn85kp" target="_blank"><img src="http://i67.tinypic.com/nn85kp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

i was under the impression it was as simple as uploading an image to an image host site and copy and pasting the HTML code to the about me section....all i see is the actual code after updating.....am i missing something?

EmiliaSong · Sep 1, 2017

Kyothegreat said:
ive been trying various code options to get an image into my Bio with no luck......can anyone tell me what is wrong with this code?

<a href="http://tinypic.com?ref=nn85kp" target="_blank"><img src="http://i67.tinypic.com/nn85kp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

i was under the impression it was as simple as uploading an image to an image host site and copy and pasting the HTML code to the about me section....all i see is the actual code after updating.....am i missing something?

<img src="http://whateverhostingsiteyoureusing.com/ImageName.png" alt="Nickname for Image"></a>

^That's all you really need^ <a href> will link you to the image hosting site, so delete that part. So for you it should look something like this:

<img src="http://i67.tinypic.com/nn85kp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

I hope this works!

Kyothegreat · Sep 2, 2017

EmiliaSong said:
<img src="http://whateverhostingsiteyoureusing.com/ImageName.png" alt="Nickname for Image"></a>

^That's all you really need^ <a href> will link you to the image hosting site, so delete that part. So for you it should look something like this:

<img src="http://i67.tinypic.com/nn85kp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

I hope this works!

Tried again with the same results....about me section is full of just the "img src" code but no image.....i feel its something silly im missing but I haven't played with HTML code since...high-school.....one of those "if u don't use it u lose it" moments, my HTML days a way behind me :3

Dan N · Sep 2, 2017

Kyothegreat said:
ive been trying various code options to get an image into my Bio with no luck......can anyone tell me what is wrong with this code?

<a href="http://tinypic.com?ref=nn85kp" target="_blank"><img src="http://i67.tinypic.com/nn85kp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

i was under the impression it was as simple as uploading an image to an image host site and copy and pasting the HTML code to the about me section....all i see is the actual code after updating.....am i missing something?

This should work.

HTML:

<img src="http://oi67.tinypic.com/nn85kp.jpg" style="display:block;width:100%;height:auto;border:0;margin:120px auto 30px -140px;"/>

Your image must end with image extension (.jpg / .gif / .png) don't use the option from left sidebar with the link for your image because it will not render well... right click on your image (tinypic page) select open image in new tab... if you see only the image and nothing else, copy the url from the address bar... done.
By the way... the above code is making your image responsive using width:100% ... if your image looks way to blurry, change the 100% with a lower value like 90% or 80% ... i've also stripped the link from your original code as you don't want your visitors to leave your page.
alt attribute is useless in your case

PS: make sure your CB account is active and verified

Search

Search

Adding Images to Your Chaturbate Bio - Coding!

Jessi J

Vicky Vixxx

I haven't posted recently, hopefully will be back soon!

LoonaVision

Attachments

MiniatureKiwi

Jentis

Devinsaint

lovelicks69

murphy gooden

Attachments

Avaknoxx

Krystal Orchid

Mizzami

WebcamStartup

Deactivated Account

Mizzami

CamHarlot

Jennifer Miller

Randi

Sal

Ashlyn_x

andreasky

Dan N

Dan N

frostcity

uncoveredmanhole

feathersoflace

Dan N

Kyothegreat

EmiliaSong

Kyothegreat

Dan N

Similar threads