Styling #Hashtags?
4 posters
Page 1 of 1
Styling #Hashtags?
Is their anyway that we could style hashtags to appear like the keywords in the topic titles here: https://help.forumotion.com/t133869-style-topic-title-keywords#901194
With dark grey colored padding rather than the white colored padding in the tutorial. I'd also like to prevent normal members from using the new #Hashtag system so it can be used only for keywords in the blog entries!
@Ange Tuteur I summon you!
With dark grey colored padding rather than the white colored padding in the tutorial. I'd also like to prevent normal members from using the new #Hashtag system so it can be used only for keywords in the blog entries!
@Ange Tuteur I summon you!
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
You can set who can use it in the administration panel.
Style Hashtags: https://help.forumotion.com/t140504-additional-options-for-hashtags#955294
Style Hashtags: https://help.forumotion.com/t140504-additional-options-for-hashtags#955294
Last edited by SLGray on February 23rd 2016, 10:20 pm; edited 1 time in total
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
I see! Thanks! What about styling the Hashtags?
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
SLGray wrote:Style Hashtags: https://help.forumotion.com/t140504-additional-options-for-hashtags#955294
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
That does absolutely nothing for me. I want to style the hashtag itself not add a popup to it when highlighted. By the way is there any way to make hashtags not show the # before them?
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
The tutorial adds codes that give hashtags a selector that you can use in the CSS stylesheet to style the hashtags the way you want.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
Even without highlighting them? Because I want the styling to affect the hashtags at all times.
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
The code in the tutorial is not a hover code.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
Okay that'll work mostly, but how can I hide the # symbol in hashtags?
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
That is how the hashtag system works. You have to use that symbol to make a word a hashtag.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
I kind of want it to be used as Keywords for our blogs rather than "hashtags" though. Which is why I want style them and get rid of the symbol. I know the symbol can be hidden with CSS somehow.
@Ange Tuteur Also the code in that tutorial isn't working on my website...
@Ange Tuteur Also the code in that tutorial isn't working on my website...
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
@Ange Tuteur Could you please send me the minified CSS for this? I'm getting those weird symbols in my CSS for the Hashtag Style code...also any tips for turning the Hashtags into keywords by hiding the # symbol?
Thanks in advance!
Thanks in advance!
Rukiafan- Forumember
- Posts : 329
Reputation : 9
Language : English
Re: Styling #Hashtags?
https://help.forumotion.com/t140504-additional-options-for-hashtags#1003297
I believe if you hide the # symbol it will cause the words to not work as hashtags.
I believe if you hide the # symbol it will cause the words to not work as hashtags.
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Re: Styling #Hashtags?
Use the script below to slice the hash from hashtags.
The modification is aesthetic, so the hashtags will not lose their normal functionality.
- Code:
$(function() {
$('a[href^="/tags/"]').each(function() {
var html = this.innerHTML;
if (html.charAt(0) == '#') {
this.innerHTML = html.slice(1);
}
});
});
The modification is aesthetic, so the hashtags will not lose their normal functionality.
Re: Styling #Hashtags?
This is the popup CSS :
This is the hashtag CSS :
and this is the sceditor dropdown CSS ( if you installed the sceditor script ) :
For future reference anyone can minify CSS code with this tool :
https://cssminifier.com/
- Code:
.fa_hashtag-options{color:#666;font-size:11px;font-family:Verdana,Arial,Helvetica,sans-serif;line-height:14px;background:#EEE;border:1px solid #CCC;border-radius:3px;box-shadow:0 3px 6px rgba(0,0,0,.175);margin-top:20px;padding:3px;position:absolute;z-index:100}.fa_hashtag-title{font-size:12px;border-bottom:1px solid #CCC;padding-bottom:3px;margin-bottom:3px}.fa_hashtag-options a{color:#333;text-decoration:none;display:inline-block;padding:2px 6px 2px 0}.fa_hashtag-options a:hover{color:#666;text-decoration:underline}.fa_hashtag-options b{color:#333;padding-left:6px}.fa_hashtag-tag{color:#000;font-weight:700}
This is the hashtag CSS :
- Code:
a.fa_hashtag{color:#666;text-decoration:none;background-color:#EEE;border:1px solid #CCC;border-radius:3px;display:inline-block;padding:3px}a.fa_hashtag:hover{color:#333;background-color:#DDD;border-color:#999}
and this is the sceditor dropdown CSS ( if you installed the sceditor script ) :
- Code:
.sceditor-button-hashtag div{background-image:url(http://i19.servimg.com/u/f19/19/06/98/92/scehas11.png)!important}#fa_hashtag{background:url(http://i19.servimg.com/u/f19/19/06/98/92/scehas11.png) 3px 50% no-repeat #FFF;padding-left:22px}
For future reference anyone can minify CSS code with this tool :
https://cssminifier.com/
Similar topics
» how to fix styling of this script
» hashtags and tags
» Hashtags don't work
» Styling Boxes
» CSS Rank Styling
» hashtags and tags
» Hashtags don't work
» Styling Boxes
» CSS Rank Styling
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum