The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Avatar element

4 posters

Go down

Solved Avatar element

Post by Hert June 18th 2015, 3:32 pm

Hello,

I think most of you are familiar with the { USERNAME } element, I think it's an element but I will just call it that in this topic.
I was wondering if there is also a possiblity to do this with the avatar? I've seen it on other forums but I can't find the right element. I also don't know if it has to look something like: <img src="{USER_AVATAR}"> or something like that?

Hopefully someone can help me!

Greetings,
Hert
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by SLGray June 18th 2015, 7:32 pm

What are you trying to with the avatar element?


avatar - Avatar element Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: Avatar element

Post by Hert June 18th 2015, 11:13 pm

I actually want to recreate the login widget, so I can customize it (:
I've already found out how I can make a login one, but I don't know how to make a status one - since I don't have the avatar element sadly.

Hopefully this anwsers your question (:
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by SLGray June 19th 2015, 12:19 am

Status and avatar are two completely different things.


avatar - Avatar element Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 12:06 am

Okay I decided to make some images, because appearently I can't explain things.

Normally you have this widget, the login widget, and when you login you get this status thing:
Spoiler:

Now what I want out of this widget is the element that is used for this, the avatar, so I can recreate it in my own widget and personalize it:
Spoiler:

I really don't know how to make it any clearer, really. So hopefully it's understandable now.
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by Ape June 20th 2015, 1:33 am

i think this is what your looking for
Code:
{L_AVATAR_IMG}


avatar - Avatar element Left1212avatar - Avatar element Center11avatar - Avatar element Right112
avatar - Avatar element Ape_b110
avatar - Avatar element Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 19084
Reputation : 1988
Language : fluent in dork / mumbojumbo & English haha

http://chatworld.forumotion.co.uk/

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 1:43 am

It isn't working, or I'm doing something wrong.
I've tried just putting it in the widget and in the code <img src="{L_AVATAR_IMG}"> but neither seem to work for some reason.
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by Ange Tuteur June 20th 2015, 11:12 am

Hi @Hert

The one that you're looking for should be this : https://github.com/Etana/template/blob/master/var/USERNAME_AVATAR.md#readme

However, this variable is only applicable to the templates. ( Templates > Portal > mod_login, for example ) You can find a complete template variable list here, however note that the majority is in French.

If you want to achieve this outside the templates, I would recommend placing this where HTML ( and <script> ) formats. Such as a widget, HTML page, or homepage message.
Code:
<script type="text/javascript">document.write(_userdata.avatar)</script>
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 6:05 pm

I thinking that working in the template is going to work better, but the problem I'm facing now is that nothing seems to work on the avatar. I want to change the size a bit, make it - for example - 50px by 50px. I've tried by adding a class to the div but it ignores it.
I've even tried putting in seperate hight and width properties and even with a style part in the div code, but it just ignores it completely.
I know it can be done, I've seen it on another forum. I've also tried using the script in my own widget - but that ignores it aswell.

The code I found in the template that I'm focusing on is this one:
Code:
<div style="float:{DIRECTION};">{USERNAME_AVATAR}</div>


I'm sorry if my explanation might seem a bit vague, but I'm not that good at it ^^'
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by SLGray June 20th 2015, 7:08 pm

Are you publishing the template after saving the changes?


avatar - Avatar element Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 7:10 pm

Yes, I am.
I've worked enough with them to know that, I'm not such a big a noob.
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by SLGray June 20th 2015, 7:12 pm

Have you tried using the option in the avatar section to set the size?


avatar - Avatar element Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 7:17 pm

That won't work. I've put it at 150x200 pixels, because I like that size on the normal forum etc.
But in the widget I just want it to be a little bit smaller because it looks too big otherwise.
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by Ange Tuteur June 20th 2015, 8:25 pm

It appeared to be working for me by making the addition. You added a class and then proceeded to make modifications via CSS, correct ? This is what I used and it worked correctly.

HTML :
Code:
<div class="faAvatar">{USERNAME_AVATAR}</div>

CSS :
Code:
.faAvatar img { width:50px }

The only other thing I can think of was were you changing the DIV's style via CSS instead of selecting IMG inside your container ?
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Avatar element

Post by Hert June 20th 2015, 9:44 pm

I did it similiar to that, yes, but forgot the img part in the CSS code - so now it works!
Thank you!

I was, however, wondering if you could use the {USERNAME_AVATAR} as a background image or something, because the changing in width and height could result in making the avatar look stretched out etc.
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by Ange Tuteur June 21st 2015, 12:04 am

Hert wrote:I did it similiar to that, yes, but forgot the img part in the CSS code - so now it works!
Thank you!

I was, however, wondering if you could use the {USERNAME_AVATAR} as a background image or something, because the changing in width and height could result in making the avatar look stretched out etc.
If you're adjusting both the height AND width, it will cause some deformation. I'd recommend only adjusting the width to the maximum value you want, since width normally induces horizontal overflow ( scrollbar ) which isn't a desirable result.

If you want to cut the image off, I'd recommend a setup similar to this ( uses the container class from my example ) :
Code:
.faAvatar {
  height:100px;
  width:100px;
  overflow:hidden; /* clips image */
}

Setting the overflow to hidden will effectively clip the image if it exceeds the specified width and height.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Avatar element

Post by Hert June 21st 2015, 12:32 am

Well I tried it with only adjusting the width, but since most people just a 150x200 pixel avatar and I wanted to make a 100x100 one in the widget I couldn't just only adjust the width for the height would still be too long (:

But the clipping worked, thank you very much!

It's solved now ^^
Hert
Hert
Forumember

Posts : 81
Reputation : 3
Language : Dutch and English

http://afterthefall.actieforum.com/

Back to top Go down

Solved Re: Avatar element

Post by Ange Tuteur June 21st 2015, 1:53 am

You're welcome ^^

Topic archived

Have a nice week. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum