Choose from our various pricing plans. There is a package for everyone!


Share this topic (URL, BBCode & HTML)

View previous topic View next topic Go down

Tutorial Share this topic (URL, BBCode & HTML)

Post by Mati™ on Mon Nov 10, 2014 11:29 am

This little modification adds a table at the end of every topics. This table contains 3 areas where users can copy/paste a code so they can put the topic link in a forum direct URL, BBCode or in a Website/blog HTML.

Preview Image:


Go in Administration Panel Display Templates/General viewtopic_body

For PhpBB3 Find:
Code:
 <div class="pagination">
 {PAGE_NUMBER}
 </div>
</div>
<div class="clear"></div>

Add Below:
Code:
<div class="forabg_staff">
   <d>Share this topic...</d>  
 <table style="background-color:#fbfdfe;border-collapse:collapse;border:1px solid #c5ced9;width:100%" border="1" cellpadding="3" cellspacing="3">
  
 <tbody>
 <tr class="forumlinenb">
<th colspan="4">Link this topic</th>
</tr>  
 <tr style="border:1px solid #88a4d6">
 <td style="width:50px;padding: 4px; border:1px solid #c5ced9">
  <strong>URL:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="{FORUM_URL}{TOPIC_URL}" />  
 </td>
  
 </tr>
  
 <tr style="border:1px solid #c5ced9">
  
 <td style="padding: 4px;">
  <strong>BBCode:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="[url={FORUM_URL}{TOPIC_URL}] {TOPIC_TITLE} [/url]" />  
 </td>
  
 </tr>
  
 <tr>
  
 <td style="border:1px solid #c5ced9;padding: 4px;">
  <strong>HTML:</strong>  
 </td>
  
 <td style="padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="<a href='{FORUM_URL}{TOPIC_URL}'> {TOPIC_TITLE} </a>" />  
 </td>
  
 </tr>
  
 </tbody>
  
 </table>
</div>

-------------------------------------------
For PhpBB2 Find:
Code:
<table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0">

Add Above:
Code:
<div class="forabg_staff">
   <d>Share this topic...</d>  
 <table style="background-color:#fbfdfe;border-collapse:collapse;border:1px solid #c5ced9;width:100%" border="1" cellpadding="3" cellspacing="3">
  
 <tbody>
 <tr class="forumlinenb">
<th colspan="4">Link this topic</th>
</tr>  
 <tr style="border:1px solid #88a4d6">
 <td style="width:50px;padding: 4px; border:1px solid #c5ced9">
  <strong>URL:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="{FORUM_URL}{TOPIC_URL}" />  
 </td>
  
 </tr>
  
 <tr style="border:1px solid #c5ced9">
  
 <td style="padding: 4px;">
  <strong>BBCode:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="[url={FORUM_URL}{TOPIC_URL}] {TOPIC_TITLE} [/url]" />  
 </td>
  
 </tr>
  
 <tr>
  
 <td style="border:1px solid #c5ced9;padding: 4px;">
  <strong>HTML:</strong>  
 </td>
  
 <td style="padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="<a href='{FORUM_URL}{TOPIC_URL}'> {TOPIC_TITLE} </a>" />  
 </td>
  
 </tr>
  
 </tbody>
  
 </table>
</div>

-------------------------------------------

For PunBB Find:
Code:
<div class="pun-crumbs">
 <p class="crumbs">
 <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} »&nbsp;
 <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
 </p>
</div>

Add Below:
Code:
<div class="forabg_staff">
   <d>Share this topic...</d>  
 <table style="background-color:#fbfdfe;border-collapse:collapse;border:1px solid #c5ced9;width:100%" border="1" cellpadding="3" cellspacing="3">
  
 <tbody>
 <tr class="forumlinenb">
<th colspan="4">Link this topic</th>
</tr>  
 <tr style="border:1px solid #88a4d6">
 <td style="width:50px;padding: 4px; border:1px solid #c5ced9">
  <strong>URL:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="{FORUM_URL}{TOPIC_URL}" />  
 </td>
  
 </tr>
  
 <tr style="border:1px solid #c5ced9">
  
 <td style="padding: 4px;">
  <strong>BBCode:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="[url={FORUM_URL}{TOPIC_URL}] {TOPIC_TITLE} [/url]" />  
 </td>
  
 </tr>
  
 <tr>
  
 <td style="border:1px solid #c5ced9;padding: 4px;">
  <strong>HTML:</strong>  
 </td>
  
 <td style="padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="<a href='{FORUM_URL}{TOPIC_URL}'> {TOPIC_TITLE} </a>" />  
 </td>
  
 </tr>
  
 </tbody>
  
 </table>
</div>

-------------------------------------------
For Invision Find:
Code:
<!-- BEGIN viewtopic_bottom -->
<br />
<div class="borderwrap">
 <div class="bar clearfix">
 <div class="left rtl-inversion-left">
 <input type="hidden" name="t" value="{TOPIC_ID}" />

 <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
 <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

 {S_TOPIC_ADMIN}
 </div>
 <div class="right rtl-inversion-right">
 {L_TABS_PERMISSIONS} <br />{S_AUTH_LIST}
 </div>
 </div>
</div>
<!-- END viewtopic_bottom -->

Add Above:
Code:
<div class="forabg_staff">
   <d>Share this topic...</d>  
 <table style="background-color:#fbfdfe;border-collapse:collapse;border:1px solid #c5ced9;width:100%" border="1" cellpadding="3" cellspacing="3">
  
 <tbody>
 <tr class="forumlinenb">
<th colspan="4">Link this topic</th>
</tr>  
 <tr style="border:1px solid #88a4d6">
 <td style="width:50px;padding: 4px; border:1px solid #c5ced9">
  <strong>URL:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="{FORUM_URL}{TOPIC_URL}" />  
 </td>
  
 </tr>
  
 <tr style="border:1px solid #c5ced9">
  
 <td style="padding: 4px;">
  <strong>BBCode:</strong>  
 </td>
  
 <td style="border:1px solid #c5ced9; padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="[url={FORUM_URL}{TOPIC_URL}] {TOPIC_TITLE} [/url]" />  
 </td>
  
 </tr>
  
 <tr>
  
 <td style="border:1px solid #c5ced9;padding: 4px;">
  <strong>HTML:</strong>  
 </td>
  
 <td style="padding: 4px;">
  <input type="text" onclick="this.select()" style="width:700px;" value="<a href='{FORUM_URL}{TOPIC_URL}'> {TOPIC_TITLE} </a>" />  
 </td>
  
 </tr>
  
 </tbody>
  
 </table>
</div>


We need to add some CSS:
Code:
.forabg_staff {
    background: url("http://i39.servimg.com/u/f39/19/02/00/01/mainti10.png") repeat-x scroll 0 0 #1e4371;
    border: 1px solid #17355a;
    border-radius: 4px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
    clear: both;
    margin-bottom: 10px;
    padding: 15px 7px 7px;
}
.forabg_staff d {
    color: white;
    font-weight: bold;
    position: relative;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    top: -10px !important;
}
input {
    border: 1px solid #ddd8ee;
    color: #333;
    height: 20px;
}
.forumlinenb th {
    background: url("http://i59.servimg.com/u/f59/14/73/12/96/bg_th10.gif") repeat-x scroll left top #ffffff;
    color: #225599;
    height: 24px;
}

When finish Save & Publish the template.
avatar
Mati™
Administrator
Administrator

Age : 31
Posts : 2112
Join date : 2011-10-20
Forum Version : PhpBB3
Reputation : 147

View user profile http://fmfocus.forumotion.net/forum

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