This section contains detailed articles elaborating on some of the common issues phpBB users encounter while using the product. Articles submitted by members of the community are checked for accuracy by the relevant phpBB Team. If you do not find the answer to your question here, we recommend looking through the Support Section as well as using the Site Wide Search.

Prosilver: Changing the appearance of the footer

Description: Changes prosilver's footer so birthdays, statistics, and who is online have icons.

In Categories:

Link to this article: Select All
[url=https://www.phpbb.com/support/docs/en/3.0/kb/article/prosilver-changing-the-appearance-of-the-footer/]Knowledge Base - Prosilver: Changing the appearance of the footer[/url]

Let us now change the appearance of the footer style prosilver.

Open: styles/prosilver/templates/index_body.html

Find:

Code: Select all

<!-- IF S_DISPLAY_ONLINE_LIST -->
   <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF -->
   <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST}
   <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p>
<!-- ENDIF -->

<!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST -->
   <h3>{L_BIRTHDAYS}</h3>
   <p><!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF --></p>
<!-- ENDIF -->

<!-- IF NEWEST_USER -->
   <h3>{L_STATISTICS}</h3>
   <p>{TOTAL_POSTS} &bull; {TOTAL_TOPICS} &bull; {TOTAL_USERS} &bull; {NEWEST_USER}</p>
<!-- ENDIF -->


Replace with:

Code: Select all

<br />
    <!-- IF NEWEST_USER -->
       <div class="forabg">
          <div class="inner"><span class="corners-top"><span></span></span>
             <ul class="topiclist">
                <li class="header">
                   <dl class="icon">
                      <dt><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></dt>
                  </dl>
               </li>
            </ul>
            <ul class="topiclist forums">
                <li class="row">
                   <dl class="icon" style="background-image: url({T_THEME_PATH}/images/user.png); background-repeat: no-repeat;">
                      <dt title="{L_WHO_IS_ONLINE}" style="width: auto;">
                         <span>{TOTAL_USERS_ONLINE}
                            <br />{RECORD_USERS}
                           <br />
                           <strong>{LOGGED_IN_USER_LIST}</strong><br/>
                           <!-- IF LEGEND --><br /><strong>{L_LEGEND}:</strong> {LEGEND}<!-- ENDIF -->
                        </span>
                     </dt>
                  </dl>
               </li>
            </ul>
         <span class="corners-bottom"><span></span></span></div>
      </div>
    <!-- ENDIF -->

    <!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST -->
        <div class="forabg">
          <div class="inner"><span class="corners-top"><span></span></span>
             <ul class="topiclist">
                <li class="header">
                   <dl class="icon">
                    <dt>{L_BIRTHDAYS}</a></dt>
               </dl>
            </li>
         </ul>
         <ul class="topiclist forums">
             <li class="row">
                <dl title="{L_CONGRATULATIONS}" class="icon" style="background-image: url({T_THEME_PATH}/images/calendar.png); background-repeat: no-repeat; width: auto;">
                   <dt style="width: auto;">
                      <span class="forumtitle">
                         <!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF -->
                     </span>
                  </dt>
               </dl>
            </li>
         </ul>
      <span class="corners-bottom"><span></span></span></div>
    </div>
    <!-- ENDIF -->

    <!-- IF NEWEST_USER -->
       <div class="forabg">
             <div class="inner"><span class="corners-top"><span></span></span>
                <ul class="topiclist">
                    <li class="header">
                        <dl class="icon">
                        <dt>{L_STATISTICS}</dt>
                   </dl>
                </li>
             </ul>
            <ul class="topiclist forums">
                <li class="row">
                   <dl class="icon" style="background-image: url({T_THEME_PATH}/images/stats.png); background-repeat: no-repeat; width: auto;">
                            <dt title="{L_STATISTICS}" style="width: auto;">
                         <span class="forumtitle">
                            <strong>{TOTAL_POSTS} &bull; {TOTAL_TOPICS} &bull; {TOTAL_USERS}
                               <br />{NEWEST_USER}</strong>
                        </span>
                     </dt>
                  </dl>
               </li>
            </ul>
         <span class="corners-bottom"><span></span></span></div>
      </div>
    <!-- ENDIF -->

   <br />


Save the three images below:
Birthday (save as calendar.png)
Image

Statistic (save as stats.png)
Image

Who is online (save as user.png)
Image

Send images to: styles/prosilver/theme/images/*.*

Do not forget to refresh the template style: ACP > Styles > Templates > Prosilver - Refresh


Chart icon by FatCow Web Hosting - CC BY 3.0
Calendar icon by Oxygen Team - LGPL
Messenger icon by Sergio Sanchez Lopez - GPL