Welcome Guest [Log In] [Register]
Search Members Calendar | Rules ZB Code Index IF Code Index
ZBCode
  • Navigation
  • ZBCode
  • Coding Resources
  • Zetaboards Modifications
  • [SC] Announcement/Magazine
Hey, welcome to ZBCode, the premier coding forum for ZB. Here you fill find some of the best Invisionfree and Zetaboards Codes on the network! Unfortunately, you're sorta hovering around in guest mode at the moment; why not join in on the fun? Register an account and you can start accessing the wealth of resources we have available here. Enjoy your stay at ZBCode, and remember to tell all your friends about us; the more members, the more codes available. ;)

Interested in joining? Click here.


If you are already a member of ZBCode, feel free to login right here:

Username:   Password:
Locked Topic
[SC] Announcement/Magazine; Either One
Tweet Topic Started: May 10 2009, 06:32 PM (1,396 Views)
Vitality May 10 2009, 06:32 PM Post #1
Member Avatar
Tabula Rasa

Posts:
784
Group:
Former Staff
Member
#320
Joined:
Jul 26, 2008
What does it do: Originally I was creating this to be a magazine style addition, but turns out as I worked through it, things seemed to look very much like an announcement code. So, go ahead and use it as either one. It just adds a link in your submenu and when you click it, the box pops up.
Preview: http://aquate.us/u/MagPrev.png
Where does it go: Where you want these announcements/magazine page(s) to appear. Above the Board works best. Copy and paste both of these into the same section, and keep the first part (The Box) on top.

The Box
Code: HTML
 
<div class="category" style="display:none;" id="themag"><table class="cat_head"><tr><td><h2>THE_HEADER_TITLE <a style='cursor:pointer;' onclick="hideMag()">[THE_CLOSE_SYMBOL]</a></h2></td></tr></table><table><tr><td>THE_DEFAULT_TEXT_IN_BOX</td></tr><tr><td class="c_foot" id="bottompages"></td></tr></table></div>


The Code
Code: HTML
 
<script type="text/javascript">
/*ZBCode - Vitality*/
var eSublink="SUBMENU_LINK";
var eMessage = ["Page 1 content","Page 2 content","Page 3 content","Page 4 content"].reverse();
var eArticle = 0;
var emG = eMessage.length;
document.getElementById("submenu").innerHTML+="<a style='cursor:pointer' onclick='showMag()'>"+eSublink+"</a>";
while (emG--) {
eArticle++;
document.getElementById('bottompages').innerHTML += "<a style='cursor:pointer; font-weight:bold;' onclick='nextPage(this,\""+eMessage[emG]+"\")'>["+eArticle+"]</a> ";
}
function nextPage(zbc,zbcv) { zbc.parentNode.parentNode.parentNode.childNodes[0].childNodes[0].innerHTML = zbcv; }
function showMag(){ document.getElementById("themag").style.display='block'; }
function hideMag(){ document.getElementById("themag").style.display='none'; }
</script>


Okay, let us begin editing!

If you look to your first snippet (The Box) you will have some text to edit for your own personalization. Basically anything in upper case letters needs an edit. I'll walk you through it:
THE_HEADER_TITLE = The title of your box. It will appear on the top next to the close symbol.
[THE_CLOSE_SYMBOL] = When you click this, the box will disappear. [X] looks nice, as well as [Close]. Use what you like though.
THE_DEFAULT_TEXT_IN_BOX = What will appear in the box before you click the pages. In other words, your cover page.
That covers The Box editing.

This is for the second half (The Code):
Code: HTML
 
var eSublink="SUBMENU_LINK";
*The text for the link that will appear in the submenu to pop up the box.*

Code: HTML
 
var eMessage = ["Page 1 content","Page 2 content","Page 3 content","Page 4 content"]
*What will be on each page. Edit whatever is between "" and if you want to add more just set up another "". Make sure you put a comma before: "one","two"...*



And that's that. As you add more to that last edit we discussed, another link to that page will automatically appear, so don't worry about adding [1] [2] [3] and so on.
A thank you goes to Reid for the help!

Enjoy
Edited by Reid, Jun 15 2009, 08:16 PM.
Offline Profile Goto Top
 
Flavius May 11 2009, 04:36 AM Post #2
Member Avatar


Posts:
283
Group:
Member
Member
#360
Joined:
Jul 29, 2008
Coding language
HTML/CSS
Is this like that code which you click and different sections show up? I remeber someone made one with a close in the right boottom corner to go back to the first page and the links were along the h2.
Posted Image
Offline Profile Goto Top
 
Reid May 11 2009, 03:18 PM Post #3
Member Avatar
What? The land of the free? Whoever told you that was your enemy.

Posts:
1,790
Group:
Distinguished Coder
Member
#148
Joined:
Jul 20, 2008
Mm, basically it adds a link in the submenu to pop up a box right above the board. You add the content in the script. Then, you can click on the [1], [2], [3], [4], etc and it will swap through what you put in the content.
The Resource Board
Offline Profile Goto Top
 
iZach May 12 2009, 12:52 AM Post #4
Member Avatar


Posts:
31
Group:
Member
Member
#107
Joined:
Jul 18, 2008
Coding language
HTML/CSS
Cool! I gotta use this
Wrote my FIRST JS Code! <3
Offline Profile Goto Top
 
triforceguy1 May 19 2009, 10:51 AM Post #5


Posts:
2
Group:
Member
Member
#2,867
Joined:
Apr 25, 2009
Coding language
None
Hi,

I have added this code to the correct place of the forum template but it isn't showing up properly, this is the code I'm using:

Spoiler: click to toggle
Code:
 
<div class="category" style="display:none;" id="themag"><table class="cat_head"><tr><td><h2>Hyrule Digest<a style='cursor:pointer;' onclick="hideMag()">[X]</a></h2></td></tr></table><table><tr><td>Welcome to The Hyrule Digest where you can find out about different updates of the forums. UPDATED FREQUENTLY!</td></tr><tr><td class="c_foot" id="bottompages"></td></tr></table></div>


<script type="text/javascript">
/*ZBCode - Vitality*/
var eSublink="The Hyrule Digest";
var eMessage = ["This issue of The Hyrule Digest will cover a few of the new mods that have recently been added. <p></p> Click [2] to go to the next page","<center>Hyrule Digest<center> <p></p> <p></p> The Hyrule Digest was added to the forum on 18th May and it will be updated regularly to easily inform everyone on new updates to the forum, it will also include updates from our affiliates.","<center> Awards <center> <p></p> <p></p> Yep, we finally finished installing the Awards Mod, each award has a different way of earning it and new awards will be introduced from time to time. <p></p> To find out more about the Awards Mod then <a href="http://s1.zetaboards.com/Make_Mii_Famous/pages/awards/t">CLICK HERE</a>!","<center>New Fan Art<center> <p></p> <p></p> The <a href="http://www.thesacredrealm.net/main.php?page=art.html">fan art</a> gallery has been updated, with 19 new pieces added. Among the new pieces are sketches, a watercolour painting, and even a piece of art from The Hero of Time movie. ","That's all for this issue, keep checking back for the next.;)"].reverse();
var eArticle = 0;
var emG = eMessage.length;
document.getElementById("submenu").innerHTML+="<a style='cursor:pointer' onclick='showMag()'>"+eSublink+"</a>";
while (emG--) {
eArticle++;
document.getElementById('bottompages').innerHTML += "<a style='cursor:pointer; font-weight:bold;' onclick='nextPage(this,\""+eMessage[emG]+"\")'>["+eArticle+"]</a> ";
}
function nextPage(zbc,zbcv) { zbc.parentNode.parentNode.parentNode.childNodes[0].childNodes[0].innerHTML = zbcv; }
function showMag(){ document.getElementById("themag").style.display='block'; }
function hideMag(){ document.getElementById("themag").style.display='none'; }
</script>


Please can someone help me asap?

Thanks
Leon

http://s1.zetaboards.com/Make_Mii_Famous/index/
Offline Profile Goto Top
 
Azuvala Mar 14 2010, 08:21 PM Post #6


Posts:
13
Group:
Member
Member
#3,692
Joined:
Feb 15, 2010
Coding language
None
I've been wondering recently- is there a limit to the number of words that the magazine may contain? I've managed to add the Cover Page and Page 1 content to my magazine without any trouble.

I've managed to avoid common mistakes and make the coding work. But now, it seems that I simply cannot add anything to my Page 2 content. I can change the font size, but if I put anything about as long as a sentence, I can no longer add anything else and the magazine disappears and stops working completely.

Is this a problem with the sheer amount of text I'm adding, or is this something else?
Also, I was wondering if there is anyway to remove the fourth page, as I only really need three.


Also, Leon, I believe I've noticed one problem with your code as I made the same mistake at first- the magazine does differentiate quotations between <> from those that separate the magazine pages. So your link with quotations cuts off your pages incorrectly, and the coding no longer works because of it.

I don't know how to remedy this besides taking out the <a href=""></a> links completely, as I do not know how to make the <a href=""> tag work without quotations. If you do take them out, that should at least remove that problem.
Edited by Azuvala, Mar 14 2010, 08:26 PM.
Offline Profile Goto Top
 
Josh Mar 22 2010, 11:25 AM Post #7
Member Avatar


Posts:
73
Group:
Member
Member
#3,745
Joined:
Mar 22, 2010
Would be interesting to find another preview that works for this. I'm interested in using it.
Posted Image
Selling ZB themes, either all in one or separate (all graphics included)
PM me for more details.
Offline Profile Goto Top
 
SlyCooperFan1 Apr 11 2010, 08:08 PM Post #8
Master Raccoon Thief Coder

Posts:
214
Group:
Member
Member
#1,306
Joined:
Oct 22, 2008
New preview:

Click Latest News at the top right.
This is the code I used for it:
Spoiler: click to toggle
Code:
 
<div class="category" style="display:none;" id="themag"><table class="cat_head"><tr><td><h2>Latest News<a style='cursor:pointer;' onclick="hideMag()">[X]</a></h2></td></tr></table><table><tr><td>This is the latest news!</td></tr><tr><td class="c_foot" id="bottompages"></td></tr></table></div>




<script type="text/javascript">
/*ZBCode - Vitality*/
var eSublink="Latest News";
var eMessage = ["This is content for page 1.","This is content for page 2.","This is content for page 3.","This is content for page 4."].reverse();
var eArticle = 0;
var emG = eMessage.length;
document.getElementById("submenu").innerHTML+="<a style='cursor:pointer' onclick='showMag()'>"+eSublink+"</a>";
while (emG--) {
eArticle++;
document.getElementById('bottompages').innerHTML += "<a style='cursor:pointer; font-weight:bold;' onclick='nextPage(this,\""+eMessage[emG]+"\")'>["+eArticle+"]</a> ";
}
function nextPage(zbc,zbcv) { zbc.parentNode.parentNode.parentNode.childNodes[0].childNodes[0].innerHTML = zbcv; }
function showMag(){ document.getElementById("themag").style.display='block'; }
function hideMag(){ document.getElementById("themag").style.display='none'; }
</script>
Edited by SlyCooperFan1, Apr 28 2010, 04:08 PM.
ZBCode is no longer active.
Please visit these sites for codes:
Outline - Zathyus Networks
Offline Profile Goto Top
 
protego Apr 27 2010, 03:47 PM Post #9
Flash Guru

Posts:
59
Group:
Member
Member
#3,798
Joined:
Apr 24, 2010
Coding language
Everything
This code is great, I am using it to display a chat box that would take up too much room if I put it on the board index.


Offline Profile Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
ZetaBoards - Free Forum Hosting
Free Forums. Reliable service with over 8 years of experience.
Learn More · Register Now
« Previous Topic · Zetaboards Modifications · Next Topic »
Locked Topic

Track Topic · E-mail Topic Time: 7:50 PM Jul 10
Hosted for free by ZetaBoards · Privacy Policy