Simple tutorial on how to add a badge image on MyFreeCams profile page using html copy/paste code
In this short tutorial we will learn how to add a custom image “badge” on MyFreeCams profile page using simple but powerful HTML code and inline css.
For this demo we need a badge image and we will use one from this set, ready-made badges for MFC .
Ok, first step we have to do is to host the image and copy the full direct path (the url)
This image will stick to the upper-right corner of your profile, even if you scroll down until you see the footer section the badge image will be visible (that means a “sticky badge image”)
There are 3 methods to create the code for this sticky image, but we will use the easiest, fast and simple one.
Because we want to display this image as a sticky badge we have to wrap it inside HTML element (div or layer)
position: fixed – this will make the div fixed to the top margin of your browser window
height, width – size given to the html div element (the image is 80x150px)
top, right – informs the browser where to display the div element and it’s content.
Like I’ve already mentioned above… copy/paste simple HTML-CSS code.