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.

Cosmic Sleek RED v1.1 - Phpbb3

Page 2 of 2 Previous  1, 2

Go down

Cosmic Sleek RED v1.1 - Phpbb3

Post by Rhino.Freak on May 3rd 2016, 6:54 pm

First topic message reminder :


Hey everyone! So I have been working on this theme for quite some time and I feel it is finished and is now open for public to use and enjoy Very Happy This isn't simply a skin, its a full theme that has template changes and requires select JavaScripts installed.


Live Demo:
Even though screenshots don't do justice to the slick animations and transitions hidden all around the theme, here are few basic ones Smile


Step 1: Import the skin
Download the .bbtheme here : (v1.1)
and import it in your forum by going to Admin Panel > Display > Themes Management > Import the skin and then navigating to the downloaded file.

Step 2: Edit the templates
Go to Admin Panel > Display > Templates > General and edit them with the respective replacement I provide below.
Note: selecting ALL content from existing templates and replace it with edited code.

Step 3: Add the required JavaScripts
Go to Admin Panel > Modules > JavaScript Code Management > Add New
Title: Cosmic Sleek
Tick in all pages and paste the code below
(function() {
var FA = '',
  a = document.createElement('LINK');
  a.rel = 'stylesheet';
  a.type = 'text/css';
  a.href = FA;
$(function() {
  for (var a = $('.topics, .posts, .views'), i = 0, j = a.length, s; i < j; i++) {
    s = a[i].innerHTML;
    if (+s.replace(/(\d+).*/, '$1') == 1) {
      a[i].innerHTML = s.slice(0, s.length - 1);
$(function() {
  $(document.body).append('<style>#fa_toolbar #fa_right #notif_list li .contentText a { color:#2f8aa3 !important; }#fa_menulist :visited { color: #ebebeb !important;}#fa_menulist :visited :hover { color: #fff !important;}</style>');


Step 4: To get better functionality, install these additional JavaScripts.
  • To get AJAX Subscribe/Unsubscribe button next to Topic Title:
    Credits: Mr. EasyBB
    Title: whatever you like
    Tick IN TOPICS and paste the code below.
    (function(l,j,m){var b,k,c,g,e,h=true;var i=function(o,p,d){if(!i.done){return new n(o,p,d)}};i.debug=false;i.done=false;i.titles=true;i.lang={subscribe:" ",unsubscribe:" ",title_unSubscribe:"Stop watching this topic",title_subscribe:"Start watching this topic"};var n=function(o,s,d){if(typeof o=="object"){d=s;s=o;h=false}if(typeof s=="function"){d=s}if(h==true&&o.toLowerCase()=="invision"){i._anchors=b=j.querySelectorAll(".left-overview a");i._target=k=j.getElementById("text_editor_textarea").parentNode.nextSibling}if(h==true&&o.toLowerCase()=="phpbb3"){i._anchors=b=j.querySelectorAll(".right a");i._target=k=j.getElementById("text_editor_textarea").parentNode.nextSibling}if(h==true&&o.toLowerCase()=="phpbb2"){i._anchors=b=j.querySelectorAll(".gensmall a");i._target=k=j.getElementById("quick_reply").getElementsByClassName("row2")[1]}if(h==true&&o.toLowerCase()=="punbb"){i._anchors=b=j.querySelectorAll("#pun-visit li a");i._target=k=j.getElementById("pun-qpost").getElementsByClassName("frm-buttons")[0]}if(s){if(s.selector){if(s.selector.anchors){b=i._anchors=s.selector.anchors}if({}}if(s.titles&&s.titles===false){i.titles=false}if({}}var r=b,q=false,t=j.createElement("button");t.type="button";if(r){for(var p=0;p<r.length;p++){if((/\?unwatch=topic/gi).test(r[p].href)){t.value=r[p].href;r[p].parentNode.removeChild(r[p]);t.innerHTML=i.lang.unsubscribe;if(i.titles===true){t.title=i.lang.title_unSubscribe}t.className="easyBB_btn unsub";q=true}if((/\?watch=topic/gi).test(r[p].href)){t.value=r[p].href;r[p].parentNode.removeChild(r[p]);t.innerHTML=i.lang.subscribe;if(i.titles===true){t.title=i.lang.title_subscribe}t.className="easyBB_btn sub";q=true}if(c!==undefined){}if(k&&q===true){t.setAttribute("onclick","ajaxSubscribe(this)");if(!s||!s.selector){k.appendChild(t);i.done=true;break}else{k.appendChild(t);i.done=true;break}}}}console.log(d);console.log(s);if(d!==undefined){,i.done,t)}};function f(o,d){if(i.debug){return console[o](d)}}function a(o){var p=o.innerHTML,d=o.value;$.post(d,function(q){if(/no longer watching/g.test(q)){o.innerHTML=easyScribe.lang.subscribe;$(o).removeClass("unsub").addClass("sub");if(easyScribe.titles===true){o.title=easyScribe.lang.title_subscribe}o.value=o.value.replace(/\?unwatch=topic/,"?watch=topic")}if(/are now watching this/g.test(q)){o.innerHTML=easyScribe.lang.unsubscribe;$(o).removeClass("sub").addClass("unsub");if(easyScribe.titles===true){o.title=easyScribe.lang.title_unSubscribe}o.value=o.value.replace(/\?watch=topic/,"?unwatch=topic")}})}return(l.easyScribe=i)&&(l.ajaxSubscribe=a)})(this,document);
      var target =$('.page-title')[0];
  • To get Add to Favorites button next to topic title.
    Credits: 10spetter10
    Title: whatever you like
    Tick IN TOPICS and paste the code below.
    $(function() {
      var locFavLink = $('#plus_menu a[href*="add_favourite"]');;

Credits for full package: Rhino.Freak, Ange Tuteur, Nick Salloum and Mimóza for helping me solve the bugs and the support forum who's design has been the inspiration to make this theme Smile

Last edited by Rhino.Freak on May 26th 2016, 1:05 pm; edited 2 times in total

Male Posts : 1248
Reputation : 105
Language : English
Location : Mumbai, India

Back to top Go down

Re: Cosmic Sleek RED v1.1 - Phpbb3

Post by Mr.Thrash on January 9th 2017, 12:39 am

Great Job Bro! Wink

Posts : 25
Reputation : 2
Language : Greek,English

Back to top Go down

Re: Cosmic Sleek RED v1.1 - Phpbb3

Post by Pendo on February 10th 2017, 4:54 am

So far, I don't think I've encountered any bugs. My favorite part about this theme is actually how thorough and robust it is. It might even be my favorite theme of all time haha. I like spacing though so I changed the padding for the .forabg class in the CSS to give the categories a 5px gap.

Search ".forabg" (without quotes) in the CSS Editor.
Change padding property to: "padding: 0 5px;" (without quotes).

For anyone who's interested. xD I think it's more of a personal preference though.


Male Posts : 200
Reputation : 13
Language : English | CSS | HTML | BBCode | C++ | Javascript
Location : Alabama, USA

Back to top Go down

Page 2 of 2 Previous  1, 2

Back to top

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