The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Replace icons on home page

View previous topic View next topic Go down

In progress Replace icons on home page

Post by betclever on October 26th 2014, 4:29 pm

Hi all,

Is there any possibility to replace images from the template I'm using to other sports icons but only on the homepage?

In fact, I want to keep the balls system for sub-forums...

Here is a print screen to give an exemple:



You can see the orange ball when a new message has been posted and I want to keep this system but only for sub-forums.

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Sir Chivas™ on October 26th 2014, 7:09 pm

Hi,

Can you please provide both your forum URL and forum version? We might be able to do this via template editing. I'll give it a try and if I do succeed, I'll post the correct answer here.


Please be patient due to my lack of activity,
Sir Chivas.

Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6783
Reputation : 430
Language : EN, FR, ES
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 7:12 pm

Hello,

I'm using PHPBB3 and the URL to my website is: www.betclever.net

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 9:31 pm

Hello betclever,

Go to Administration Panel > Display > Pics management > Advanced > Icones for the forum

You can change the icons here :



The subforum icons for topics can be found in "Icons for topics"

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 9:35 pm

Hello Ange Tuteur,

I know this manipulation but I have different sports and have to apply icons for each sport.

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 9:39 pm

You could add an image in the description of that forum, and adjust its position with CSS. An image with a class for example :
Code:
<img class="descImg" src="/myimage.gif" />
Replace /myimage.gif by the URL of your image.

Then you could adjust it with CSS, depending on where you want to display it.
Code:
.descImg {
 /* properties.. */
}

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 9:40 pm

I just to replace the ball with the image.
Shall I do what you have posted to replace the ball with the icon I want?

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 9:48 pm

Since the way to change those Icons is by pics management, yes I think using the descriptions could be a easy way to hide the images. Once you insert the images with a classname, you should be able to reposition them over the icons on the homepage.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 9:50 pm

Ok, see print screen after the change:



Can we remove the blue ball and replace it with the icon?

PS: I can do it via the CP but it will apply this thing on sub-forums too and that's not good...

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by _Twisted_Mods_ on October 26th 2014, 9:58 pm

the blue ball should be in you acp>display>pictures&colors>pictures management>advanced

either the "icons for the forms" tab
or "icons for topics" tab

_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 10:00 pm

Add this to your CSS :
Code:
.forabg dl.icon {
 background:none !important;
 position:relative;
}

.descImg {
 position:absolute;
 left:1%;
 top:30%;
}

The first rule will hide the icons, and contain the new icons. The second rule is for positioning the icons. I made a rough test so it may need adjustments.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 10:05 pm

Almost perfect Ange tuteur !

Here is the result:



Just center the icon like the blue ball and it's perfect!

Shall I add this code for each forum?

Code:
<img class="descImg" src="/myimage.gif" />

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 10:19 pm

After taking a look, I think the best choice is to set it as a background image on a block. Instead of using the image tag, we'll use a div :
Code:
<div class="blocImg" style="background-image:url(/myimage.gif)"></div>

Same as before, just replace /myimage.gif by the URL of your image.

Then use this CSS :
Code:
.forabg dl.icon {
 background:none !important;
 position:relative;
}

.blocImg {
 width:50px;
 background-repeat:no-repeat;
 background-position:center;
 position:absolute;
 left:0;
 top:0;
 bottom:0;
}

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Replace icons on home page

Post by betclever on October 26th 2014, 11:25 pm

It works perfectly Ange tuteur, thanks again!

I will replace them tomorrow but I did a test and it was wonderful.

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

In progress Re: Replace icons on home page

Post by Ange Tuteur on October 26th 2014, 11:31 pm

You're welcome. ^^

You can leave your topic open until you replace them all, just in case you run into any problems.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


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