myBadges customization - Profile Image Overlay
Profile Badges
@B360 - I know you haven't worked out the CSS and Templates files yet for this module, but just thought this would help anyone looking to customize the badges in the current state. You're welcome to use what I have. But as mentioned in the original post, might not be the "slickest" way to implement it.
Original post here: https://www.jamroom.net/the-jamroom-network/forum/design-and-skin-customization/8033/badge-overlay-customization
"Just thought I'd share this with you.
Probably not the best way to implement it, but it only took me 15 minutes to get this going.
Badge Module by @360 Thanks for this!
Running Elastic Skin.
In Photoshop, create a 64x64 pixel canvas. Add a layer, create a rectangle, then set the angle to 45 degrees. Set your colors. Add a quick drop shadow. Create another layer with your text, in this case "artist". Save as transparent .png file.
In your ACP, Upload the image to the mybadges > images section. Override whichever badge you want to replace it with. In this example, "artist_badge.png".
In the profile_header.tpl, find the div for your profile image.
Add something like this:
{* testing badge *}
{jrCore_include template="badges.tpl"}
Create a badges.tpl file. Upload it to the root of your skin dir.
YMMV in this tpl, but just as an initial test I threw this code:
<style>
.overlay_badge {
position:absolute;
left:0;
bottom:0;
z-index:5;
}
</style>
<div class="overlay_badge">{jrCore_image module="myBadges" image="artist_badge.png"}
</div>
The result is a nice little ribbon style badge on the lower corner of your profile image.
Needs more tweaking to account for profile_quota_ids but I think you get the jist. Word to your mother."
updated by @ilovehousemusic: 03/10/14 08:32:58AM