H2O: Forum icon options

H2O uses FontAwesome CSS icons to differentiate between read / unread states. This allows faster loading times and lossless quality on all devices. 


Changing icon image

The icon values are defined in: yourforum.com/Milk_v2/theme/icons_forums_topics.css

/* Set the icons */            				 /* Megaphone */
.global_read:before							{content: "f0a1";}
.global_read_mine:before					{content: "f0a1";}
.global_read_locked:before					{content: "f0a1";}
.global_read_locked_mine:before				{content: "f0a1";}
.global_unread:before						{content: "f0a1";}
.global_unread_mine:before					{content: "f0a1";}
.global_unread_locked:before				{content: "f0a1";}
.global_unread_locked_mine:before			{content: "f0a1";}


											/* Megaphone */
.announce_read:before						{content: "f0a1";}
.announce_read_mine:before					{content: "f0a1";}
.announce_read_locked:before				{content: "f0a1";}
.announce_read_locked_mine:before			{content: "f0a1";}
.announce_unread:before						{content: "f0a1";}
.announce_unread_mine:before				{content: "f0a1";}
.announce_unread_locked:before				{content: "f0a1";}
.announce_unread_locked_mine:before			{content: "f0a1";}


											/* External link */
.forum_link:before							{content: "f08e";}


											/* Speech Bubble */
.forum_read:before							{content: "f068";}
.forum_read_subforum:before					{content: "f068";}


											/* Check */
.forum_unread:before						{content: "f00c";}
.forum_unread_subforum:before				{content: "f00c";}


											/* Pin */
.sticky_read:before							{content: "f08d";}
.sticky_read_mine:before					{content: "f08d";}
.sticky_read_locked:before					{content: "f08d";}
.sticky_read_locked_mine:before				{content: "f08d";}


.sticky_unread:before						{content: "f08d";}
.sticky_unread_mine:before					{content: "f08d";}
.sticky_unread_locked:before				{content: "f08d";}
.sticky_unread_locked_mine:before			{content: "f08d";}


											/* Right arrow */
.topic_moved:before							{content: "f061";}


											/* Envelope */
.pm_read:before 							{content: "f0e0";}
.pm_unread:before 							{content: "f0e0";}


											/* Bar */
.topic_read:before							{content: "f068";}
.topic_read_mine:before						{content: "f068";}
.topic_read_hot:before						{content: "f068";}
.topic_read_hot_mine:before					{content: "f068";}
											/* Tick */
.topic_unread:before						{content: "f00c";}
.topic_unread_mine:before					{content: "f00c";}
.topic_unread_hot:before					{content: "f00c";}
.topic_unread_hot_mine:before				{content: "f00c";}


											/* Cross */
.forum_read_locked:before					{content: "f00d";}
.forum_unread_locked:before					{content: "f00d";}
.topic_read_locked:before					{content: "f00d";}
.topic_read_locked_mine:before				{content: "f00d";}
.topic_unread_locked:before					{content: "f00d";}
.topic_unread_locked_mine:before			{content: "f00d";}

Milk uses FontAwesome 4.7 icons to represent read / unread states. After finding the new icon you want to use, open its page on the FontAwesome website where you'll be able to grab the unicode value. 

Replace the unicode value above as necessary. 

See: How to edit code files

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.