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.

FoM Theme - Forumotion Board Inspired Theme (PunBB)

View previous topic View next topic Go down

FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by @Mark on January 12th 2017, 5:27 am

Hello Dearest Members! I will release a forumotion theme inspired made from scratch, with PunBB set as a version hopefully by next week.

EDIT:
- Files are now uploaded: FoM Theme - Download
- Preview it live here: Code Testing

Instructions:
1. Download the file linked above.
2. Go to ACP > Display > Skins > Themes Management:
- Import the skin: Browse the file name "code-testing-actual-20170120.bbtheme"
3. Copy all the templates code and paste it on ACP > Display > Templates (simply look for the template name).

-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-

Tutorial:
1. "Post of Staff - Change Border Color"


1.1. To add this colored border on each post of the staffs of your forum, do the following:
- Go to ACP > Users and Groups > Ranks > Rank Administration > Add new rank:
* Rank Title: (put this one and save)
Code:
<span class="staff1">Name of the rank</span>

Note 1: If you want to add another rank, simply change the staff1 into staff2 or staff3 or staff4 or staff5, the code in the JS Management I used is until 5th only, though you can add another staff6, just duplicate the code that you'll see inside the "Post Staff Change Color.txt" (change the staff5 to staff6, then nameoffifthstaff to nameofsixstaff); it should be like this:
Code:
$(function() {
  $('.staff6').closest('.post').addClass('nameofsixstaff');
});

Note 2: If you want to change the color of the border, look for the following codes inside the CSS and simply change the border-color:
Code:
/* Staff Border Top Changer */
.pun .post.nameoffirststaff {
  border-top: 12px solid #68B800 !important;
}
.pun .post.nameofsecondstaff {
  border-top: 12px solid #F5A849 !important;
}
.pun .post.nameofthirdstaff {
  border-top: 12px solid #F5A849 !important;
}
.pun .post.nameoffourthstaff {
  border-top: 12px solid #F5A849 !important;
}
.pun .post.nameoffifthstaff {
  border-top: 12px solid #F5A849 !important;
}

And if you add another staff (in the case of Note 1, we add staff6 and nameofsixstaff), you should also add its CSS line:
Code:
.pun .post.nameofsixstaff {
  border-top: 12px solid #F5A849 !important;
}

-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-o-

2. Changing Footer


2.1. To change the footer, simply go to ACP > Display > Templates > General > overall_footer_end, find the following codes and edit it:
Code:
<footer class="footer-distributed">

   <div class="footer-left">
      <h3>Code<span>testing</span></h3>
      <p class="footer-forum-name">Codetesting 2017</p>
   </div>

   <div class="footer-center">
      <p class="footer-forum-about">
      <span>About the Forum</span>
      You can put here anything about your forum, either a description, links and many more!
      </p>
   </div>

   <div class="footer-right">
      <p class="footer-forum-about">
      <span>About the Forum</span>
      You can put here anything about your forum, either a description, links and many more!
      </p>
   </div>

</footer>


Last edited by @Mark on January 20th 2017, 3:41 pm; edited 4 times in total

@Mark
Forumember

Male Posts : 205
Reputation : 39
Language : HTML | CSS | JS | C | Java
Location : Philippines

http://code-testing.forumotion.asia/

Back to top Go down

Re: FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by The Singer on January 12th 2017, 6:16 am

It is copyright

The Singer
Forumember

Male Posts : 173
Reputation : 2
Language : english

http://avacschat.yforum.biz

Back to top Go down

Re: FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by SLGray on January 12th 2017, 7:25 am

It has a copyright at the bottom.

The letter C in the circle means copyright.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 37257
Reputation : 2498
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by @Mark Yesterday at 3:39 pm

Files are now uploaded. To install the theme, read the instructions above.
If you found any bugs, please report it to me. Any suggestions, please comment it here. Thank you!

@Mark
Forumember

Male Posts : 205
Reputation : 39
Language : HTML | CSS | JS | C | Java
Location : Philippines

http://code-testing.forumotion.asia/

Back to top Go down

Re: FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by Niko Yesterday at 4:24 pm


Niko
Hyperactive

Male Posts : 2299
Reputation : 98
Language : English, French, Italian, Spanish, Latin

Back to top Go down

Re: FoM Theme - Forumotion Board Inspired Theme (PunBB)

Post by Ange Tuteur Yesterday at 5:54 pm

To be honest I'm on the fence with this theme.. At a glance it looks like you just inspected the style and markup of multiple support forums to create it, which is rather... unoriginal. I'm not saying you didn't put work into it, but that it's nothing new or different -- in fact it's kind of controversial, because the design was originally meant to be unique to the support forums of Forumactif. Still, I suppose people who want the support forum's design or want to start a support forum themselves would love this.

Ange Tuteur
Forumaster

Male Posts : 13035
Reputation : 2714
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