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.

How to change "Post Buttons" from image to text

View previous topic View next topic Go down

In progress How to change "Post Buttons" from image to text

Post by Mati on August 3rd 2015, 7:17 pm

I would like to know how to change "Post Buttons" from image to text also give a class for them...

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by levy on August 4th 2015, 3:49 am

You mean Replay, New Topic, Locked, Quote and all others or what? I don't understand it at all.

levy
Hyperactive

Male Posts : 2566
Reputation : 344
Language : Romanian, English
Location : Romania | Feel free to tag me into your topic if you have a problem

http://help.forumotion.com/

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Ange Tuteur on August 4th 2015, 11:08 am

@Mati could you provide the version of your forum ?

Thanks

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2681
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Mati on August 4th 2015, 6:11 pm

@levy wrote:You mean Replay, New Topic, Locked, Quote and all others or what? I don't understand it at all.

Yes, levy

@Ange Tuteur wrote:@Mati could you provide the version of your forum ?

Thanks

I'm using PunBB

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Ange Tuteur on August 4th 2015, 6:43 pm

Well for the reply / new topic buttons you can just edit the templates. An example with the viewtopic_body template :
Code:
      <p class="posting">
         <!-- BEGIN switch_user_authpost -->
         <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>&nbsp;&nbsp;
         <!-- END switch_user_authpost -->

         <!-- BEGIN switch_user_authreply -->
         <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
         <!-- END switch_user_authreply -->
      </p>

Find the above and just replace the image element ( for example <img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /> ) with text and add a class to the link.

I'm not entirely sure about the post options, but you could just do something like this for example :

Modules > JS codes management > new script

Placement : In the topics
Code:
$(function() {
  for (var opts = $('.post-options'), i = 0, j = opts.length, k, l, c; i < j; i++) {
    for (c = opts[i].childNodes, k = 0, l = c.length; k < l; k++) {
     
      c[k].className += ' post-button'; // add class
      c[k].tagName == 'A' ? c[k].innerHTML = c[k].firstChild.alt : c[k].src = ''; // change content depending on tag type
     
    }
  }
});
( The script just goes over the post options and applies the ALT attribute content as the innerHTML content, instead of the image )

Then some CSS to style the class added via JavaScript :
Code:
.post-button {
  background:#EEE;
  border:1px solid #CCC;
  padding:3px;
}

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2681
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Mati on August 6th 2015, 9:23 pm

Sorry @Ange Tuteur I'm using PhpBB3

And I want to change from Post new topic : to View IP address of poster : in text

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Mati on August 9th 2015, 2:08 pm

Any chance to change them...

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: How to change "Post Buttons" from image to text

Post by Ange Tuteur on August 9th 2015, 2:15 pm

Same methods I posted should apply. However, for the script, it just needs a few changes to the selected elements.
Code:
$(function() {
  for (var opts = $('.profile-icons'), i = 0, j = opts.length, k, l, c; i < j; i++) {
    for (c = opts[i].getElementsByTagName('A'), k = 0, l = c.length; k < l; k++) {
   
      c[k].className += ' post-button'; // add class
      c[k].innerHTML = c[k].firstChild.alt; // change content depending on tag type
   
    }
  }
});

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2681
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