Jump to content

Search the Community

Showing results for tags 'guide'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Site Information
    • Information
    • Staff Contact Center
    • Ask us
    • Hosting
    • Introduce Yourself
  • Spotlight RPG Challenge
  • Roleplay Conversations
    • Roleplay Chat
    • Roleplay Management
    • Brainstorming & Ideas
    • Member Confessions
    • Staff Confessions
  • Assistance
    • Site Reviews
    • Coding Help & Requests
    • Graphics Requests
  • Personal RP Requests
  • Site Requests
  • Wanted
  • Creation & Development
  • Learn HTML/CSS's General conversation
  • Learn HTML/CSS's Ask for help
  • Learn HTML/CSS's Quick Tips
  • Modern Fantasy Circle's Topics
  • Historical RPs's Topics
  • Book Club's Topics
  • Make My Life Make Sense's Topics
  • Dragonriders of Pern Boards's Topics
  • Jcink Hosted's Topics
  • Graphics Showcase & Discussion's Topics
  • MyBB Staff People's Topics
  • SMF Staff People's Topics
  • Monster Fans's Topics
  • Discord's Topics
  • Gamers's Topics
  • Pet People's Topics
  • Site Design's Topics
  • Cooking's Topics
  • Cooking's Recipes
  • Star Trek's Topics
  • Star Wars's Topics
  • Game of Thrones's Topics
  • Cosplay's Topics
  • The Writing Pad's Discussion
  • The Writing Pad's Writing Exhibit
  • MTV's THE REAL WORLD!'s Non-RP Chat & Discussion
  • MTV's THE REAL WORLD!'s RL Storytime
  • MTV's THE REAL WORLD!'s The Hot Seat
  • MTV's THE REAL WORLD!'s Forum Games
  • NaNoWriMo's Information
  • NaNoWriMo's Previous NaNoWriMo Years
  • NaNoWriMo's Current NaNoWriMo
  • Harry Potter's Topics
  • Dr Who's Topics
  • Supernatural (The TV Show)'s Topics
  • Firefly's Topics
  • The Bug Enthusiast's Bugs, mice, and all things talk
  • Vesta Software's Development
  • Vesta Software's Feature Requests
  • Vesta Software's Questions
  • Vesta Software's Feedback and Discussion
  • Vesta Software's Archives
  • Movie Club's Post-Movie
  • Movie Club's Pre-Movie
  • Movie Club's Test
  • Movie Club's Topics
  • NOVA's Topics
  • The Art Studio's Topics
  • Avatar the Last Airbender's Topics
  • Cryptozoology's Topics
  • World Building's Topics
  • World Building's Map Building
  • World Building's General Discussions
  • PHPBB Staff people's Topics
  • Xenforo Staff People's Topics
  • Cyberpunk and Transhumanism's Topics
  • Dragon Age's Companions
  • Dragon Age's Ships
  • Dragon Age's Protagonist Corner
  • Dragon Age's Lounge

Categories

  • The Initiative Services and Features
  • Forum Building and Management
  • Writing Materials
  • Being a Member
  • Software
    • IPS Character Manager
  • Coding
  • Graphics

Categories

  • Directory

Categories

  • Resources

Categories

  • Roleplay Search
  • Writing Partner Search
  • Character Home Search

Categories

  • General Update
  • Announcement
  • Articles
  • Feedback
  • Tomfoolery

Categories

  • Playby Directory

Categories

  • Application Templates
  • Plotters
  • Post Templates
  • Staff Templates
  • Thread Trackers
  • Other
  • Pending Challenge Entries
  • Past Challenge Entries

Categories

  • Active Challenges
  • Archived Challenges

Categories

  • Find Affiliates

Categories

  • Character Wanted Ads

Categories

  • Find Staff

Categories

  • Communications
  • Contributions
  • Operations

Categories

  • Creative Directory

Categories

  • Jcink Themes
  • ProBoards/FreeForums Themes
  • MyBB Themes
  • IPS Themes
  • SMF Themes
  • phpBB Themes
  • Other Themes
  • Modifications
  • Make My Life Make Sense's Files
  • Dragonriders of Pern Boards's Files
  • PHPBB Staff people's Files
  • Xenforo Staff People's Files
  • Cyberpunk and Transhumanism's Files

Blogs

  • Morrigan's Madness
  • Staff Blog
  • A pirate captain's log
  • Somnia News
  • Ghost's One-Shots
  • Bits & Bones.
  • Amelia's Blog
  • Mobydoll's Blog
  • a medieval world
  • Just a girl and her stuff....
  • Everything Super
  • Icewolf's Musings
  • Ask GR - advice for RPers
  • Loose Ends
  • Tales From The Shoebox
  • Thoughts on Roleplay
  • Salt Box
  • The Salt Mine
  • Little bit of Gothic
  • The Totally Epic and True Tales of Kit the Human
  • Obvious Blog Is Obvious
  • Fountain of Thoughts
  • Please Turn The Device Off and Back On
  • gbwhatsapp apk
  • The Veritas
  • That Necromancer Life
  • Make My Life Make Sense's Blog
  • Dragonriders of Pern Boards's Blog
  • Cryptozoology's Blog
  • Cyberpunk and Transhumanism's Blog

Calendars

  • Community Calendar
  • Character Birthdays
  • Book Club's Events
  • Make My Life Make Sense's Events
  • Dragonriders of Pern Boards's Events
  • NaNoWriMo's Virtual Write Ins
  • Cryptozoology's Events
  • Xenforo Staff People's Events
  • Cyberpunk and Transhumanism's Events

Product Groups

  • Converted Subscriptions
  • Hosting
  • Advertising

Collections

  • Settings
  • Staff
  • Notifications
  • Forums
  • Submitting to the Directory
  • RPG Directory
  • Playby Directory
  • Searching for Roleplay
  • Guides
  • Challenges
  • Character Wanted Ads
  • Affiliate & Staff search

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Discord


Twitter


Skype


NaNo House


Game of Thrones House


Bending Nation

Found 2 results

  1. Before we get started, this is what we're going to create: You can add as many articles as you like without needing to alter the script. Create Your Articles Go to webpage maker (under skins & templates) Click create new webpage Give it a page title, doesn't matter what, we're not going to see it. Give it a key, something memorable for you because you'll need it later. Set allow key to use board wrappers to No. Your contents need to include valid HTML, so wrap your paragraphs into paragraphs <p>I'm a paragraph!</p> and wrap the entire contents into a div with the class articles and it must have a unique ID. For IDs, I just use article_1 (number increasing for each new article) but you might prefer something more memorable. You will need to remember what it is. <div id="article_1" class='articles'> <p>Yay! First paragraph!</p> <p>I'm a middle paragraph</p> <p>I'm another paragraph!</p> </div> Rinse and repeat until you have the articles you want. Or just make two for the purposes of this tutorial. Create the Container The container is what will house the articles, it will also include our magical menu. Back in webpage maker (under skins & templates) Click Create a New Webpage Give it a page title, this one matters because it will appear in your nav strip. (ie. My Community -> lore) Set allow key to use board wrappers to Yes. Paste in the following code: <div id="welcome_articles"> <h1>Lore</h1> Welcome to our lore. Here you can bla bla bla. Click the links on the left to read the relevant articles. </div> <div id="article_container"> <aside> <ul class="article_container_list"> <h3>Lore Index</h3> <li><a class="container_links" href="#" data-showdiv="article_1">Link 1</a></li> <li><a class="container_links" href="#" data-showdiv="article_2">Link 2</a></li> </ul> </aside> <div class="article_content"> <% article_1 %> <% article_2 %> </div> </div> <script> $(".container_links").click(function(){ $(".articles:visible").hide(); $("#"+$(this).attr("data-showdiv")).show(); }); $('.container_links').click( function(){ if ( $(this).hasClass('active') ) { $(this).removeClass('active'); } else { $('.container_links.active').removeClass('active'); $(this).addClass('active'); } }); // following is purely to prevent page jump when user clicks on link $('a.container_links').click(function(e){ e.preventDefault(); }); </script> where <% article_1 %> and <% article_2 %> are the keys to the articles you created earlier. The javascript is already included and assuming that you don't replace your class names, it doesn't need to be altered. Besides the aforementioned keys, the most important part of the code for you is <li><a class="container_links" href="#" data-showdiv="article_1">Link 1</a></li> the data-showdiv attribute needs to be the same as one of the articles you created earlier. So, say you created an article about species and you gave it an id of species. Your link should look like this <li><a class="container_links" href="#" data-showdiv="species">Species</a></li> Once you have added the links and keys, save it. If you visit it now, you'll see that everything is displayed but clicking the link will make everything vanish except the for corresponding article. You'll also notice that the list sits on top of everything else. Time to hit the style sheets! Stylesheet Go to your stylesheets and paste in the following #welcome_articles { margin-bottom: 10px; padding: 5px; border-bottom: 1px solid rgba(0,0,0, .1); } #article_container { display: flex } #article_container .article_content { flex-grow: 2; padding: 0 20px 20px; border-left: 1px solid rgba(0,0,0, .1) } #article_container aside { padding: 10px; min-width: 15% } #article_container .articles { display: none } ul.article_container_list { list-style-type: none; margin: 0; padding: 0 } ul.article_container_list li { display: block; margin: 1px; } a.container_links { display: block; border-bottom: 1px solid rgba(0,0,0, .1); padding: 5px } a.container_links.active { padding-left: 15px } ul.article_container_list h3 { margin-top: 0 } The most important bits are #article_container { display: flex } this makes the aside and div.article_content sit next to each other. Sometimes however, the aside can look a little bit claustrophobic, so I add #article_container aside { padding: 10px; min-width: 15% } To ensure that the div.article_content grows to fill the entire space left over, I add #article_container .article_content { flex-grow: 2 } To hide all of the articles by default, I add #article_container .articles { display: none } if you are having problems with the script after adding this code, move #article_container .articles { display: none } to your guidebook page so that it sits above the scripts: ie <style> #article_container .articles { display: none } </style> <script> $(".container_links").click(function(){ $(".articles:visible").hide(); $("#"+$(this).attr("data-showdiv")).show(); }); $('.container_links').click( function(){ if ( $(this).hasClass('active') ) { $(this).removeClass('active'); } else { $('.container_links.active').removeClass('active'); $(this).addClass('active'); } }); // following is purely to prevent page jump when user clicks on link $('a.container_links').click(function(e){ e.preventDefault(); }); </script> Finally, it is useful if the displayed article's link is different from the others. To do this I add a.container_links.active { padding-left: 15px } Responsiveness Make sure your head (in the global wrappers) includes the following <meta name="viewport" content="width=device-width, initial-scale=1"> This will ensure the zoom is at 100%. If you have any fixed width elements in your header or footer you may find that that user now needs to scroll horizontally. I recommend fixing that so that those elements no longer include a fixed width. I've addressed the default fixed widths in the following code @media screen and (max-width: 979px) { body { font-size: 1rem } #wrapper { width: calc(100% - 20px); margin: 0 auto; } #article_container { display: block; } ul.article_container_list { text-align: center } #userlinks { width: 90% } ul.article_container_list li { margin-bottom: 10px } ul.article_container_list li:last-child { margin-bottom: 0 } } The important part (applicable to the guidebook) is as follows #article_container { display: block; } now the aside sits above the content. ul.article_container_list { text-align: center } we center the links (note that they automatically expand to fill the available space because we made the links into blocks earlier.) ul.article_container_list li { margin-bottom: 10px } we make the links easier to tap for a chunky finger. ul.article_container_list li:last-child { margin-bottom: 0 } but the last list item doesn't need a bottom margin, so we get rid of it. The end result for mobiles becomes this: Just want some copy and paste? <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <div id="welcome_articles"><h1>Lore</h1> Welcome to our lore. Here you can bla bla bla. Click the links on the left to read the relevant articles. </div> <div id="article_container"> <aside> <ul class="article_container_list"> <h3>Lore Index</h3> <li><a class="container_links" href="#" data-showdiv="article_1">Link 1</a></li> <li><a class="container_links" href="#" data-showdiv="article_2">Link 2</a></li> </ul> </aside> <div class="article_content"> <% article_1 %> <% article_2 %> </div> </div> <style> #welcome_articles { margin-bottom: 10px; padding: 5px; border-bottom: 1px solid rgba(0,0,0, .1); } #article_container { display: flex } #article_container .article_content { flex-grow: 2; padding: 0 20px 20px; border-left: 1px solid rgba(0,0,0, .1) } #article_container aside { padding: 10px; min-width: 15% } #article_container .articles { display: none } ul.article_container_list { list-style-type: none; margin: 0; padding: 0 } ul.article_container_list li { display: block; margin: 1px; } a.container_links { display: block; border-bottom: 1px solid rgba(0,0,0, .1); padding: 5px } a.container_links.active { padding-left: 15px } ul.article_container_list h3 { margin-top: 0 } @media screen and (max-width: 979px) { body { font-size: 1rem } #wrapper { width: calc(100% - 20px); margin: 0 auto; } #article_container { display: block; } ul.article_container_list { text-align: center } #userlinks { width: 90% } ul.article_container_list li { margin-bottom: 10px } ul.article_container_list li:last-child { margin-bottom: 0 } } </style> <script> $(".container_links").click(function(){ $(".articles:visible").hide(); $("#"+$(this).attr("data-showdiv")).show(); }); $('.container_links').click( function(){ if ( $(this).hasClass('active') ) { $(this).removeClass('active'); } else { $('.container_links.active').removeClass('active'); $(this).addClass('active'); } }); // following is purely to prevent page jump when user clicks on link $('a.container_links').click(function(e){ e.preventDefault(); }); </script> I hope that someone finds this useful! As already noted, any forum software can utilise this guide, the actual magic is the script and that is not software specific.
  2. WHO POSTED TODAY? a block for IPS forums, by Mousie Why "who posted"? You might opt to use a "who posted" block over "who was online" for one of two main reasons: You use a Linked Accounts mod that does not record users as being online even if they have posted. You want your guests to see not just who visited the site, but who actively participated. What qualifies as a "post"? This block makes use of the "member_last_post" column attached to the member row. This generates a new date stamp any time the user posts content on the forum. This includes: New posts New topics New status updates New replies to status updates New blogs New comments to blogs New database records New comments to database records So in effect, any contribution the member makes to the forum is counted as Activity. How do I install this block? You'll find the full code at the end of this post. In your ACP: Go to Pages --> Blocks Create New Block Select "type" as "Custom" Select "content editor" as "Manual PHP" Under "Details", give your block a name, description, and a template key. Under "Content", copy and paste the code at the end of this post. How do I display this block? This block is mainly designed to sit at the bottom of your forum, similar to how Who Was Online? does. You can display the block by: Opening the Page Builder menu using the > icon on the left side of your screen, and selecting the block to drag and drop where you would like it displayed. If you defined a template key, you can add the block by editing the page template and placing the "{block="my_block_key"}" in your HTML templates where you would like the block to display. If you can use Page Builder to get the block where you want it, that is usually the simplest method. How does it work? This block doesn't use data from any custom databases, so it should work for most IPS forums. You should be able to copy and paste it into a new block, place it on your forum, and it will work. However, when I began coding blocks I found it difficult to find examples of simple blocks that I could understand, and use to modify and build my own blocks. For that reason, I've broken down the code below to explain what each function does, and how it manipulates the data to get the desired result. 1. Establishing the time difference $rightnow = time(); $timevar = $rightnow - 86400; In the first line, we use the time() function to generate a unix timestamp - a number that is essentially a count of how many seconds have passed since 1/1/1970. As the function is undefined (there is no additional information between the parenthesis), it defaults to current time. It also says that whenever we use the variable $rightnow, that it is to use the datestamp created by the time function in that first line. In the second line, we instruct the system to subtract 86400 seconds from $rightnow, and call that number $timevar. Basically, we're asking the system to work out what the time is now, and take 24 hours off it. You can adjust that "86400" to whatever number you like, depending on what range you would like displayed on your block. Want posts from the past week? Subtract 604800 instead. 2. Accessing the member database // Get the select object $select = (\IPS\Db::i()->select('member_id, prefix, suffix, g_id, name, members_seo_name, member_group_id, member_last_post', 'core_members' )); Here we define a new variable, $select, that we will use to contain information from the member database. The important parts here are:\ $select - This is the variable that will store all of the information found by the select query below. (\IPS\Db::i() - This function, unique to IPS systems, tells the system that we're going to access information from the database. It's a nifty shortcut. ->select - This tells the system that we're going to choose some information from a particular database and store it in the $select variable we defined at the start of the line. In the parenthesis, we have the conditions of the select. The format is: ('{columns to select}', '{database}') There are other conditions that you can add to manipulate and refine your data, but this simple example only defines the columns and database. You can also use * as a wildcard to select all information from a particular database, eg select('*', 'core_members') will return all columns of information from the core_members table. 3. Join on group data $select = $select->join( 'core_groups', 'core_members.member_group_id=core_groups.g_id', 'LEFT'); This line is important if you want to style the output using the group colours you've defined in your system. Which you probably do, because it looks nifty. How this works, is it looks at both the core_members table, and the core_groups table (where all information about the groups is stored, including styling) and asks it to find where the member_group_id (from core_members) is the same as g_id (from core_groups). Then, in any row in core_members where those fields are the same, it adds columns to the row and populates them with the relevant data from core_groups. Sounds complicated, but you can see how it works in a plain SQL example. Important parts of this function are: $select - This is the same variable we used above. $select-->join - This says that we're going to take the data from the $select variable we created, and join more data on. Basically, we're updating the information contained in $select, and still calling that updated variable $select. In the parenthesis, again we have a set of conditions that will tell the system what data to find and how to join it. The format is ('{second_database}', '{first_database_column}={second_database_column}') 4. Begin the print print "<div class='ipsWidget ipsWidget_horizontal ipsBox'><h3 class='ipsType_reset ipsWidget_title'>Who Posted Today</h3><div style='padding: 10px;'>"; Here we start to build the HTML that will contain the information. The function "print" is an output function, it tells the system that what comes next is a visual output element. In PHP, you can use HTML code by encasing it in double quotation marks, as in the example above. To print the results of PHP variables, they must be placed outside of the quotation marks. You'll see more of that below. 5. Start analysing the data foreach( $select as $students ) { if ($students['member_last_post'] > $timevar) Here, we ask the system to look through each row in $select and compare it to a particular condition. foreach - This tells the system that we're not looking at $select as a whole, but each individual row contained within it ($select is essentially a table in itself, created by the data you have chosen). $select as $students - This tells the system that each $select row is now going to be called $students, allowing it to differentiate between $select the big group of data, and $students the row of data contained within. if - This tells the system that we're only going to proceed for rows that meet the conditions defined in the parenthesis. ($students['member_last_post'] > $timevar) - This is our condition. What it says is that any $students row where the column member_last_post (you'll remember this is the column that keeps the latest post datestamp) contains a higher value than $timevar (the variable defined at the beginning of the block) are going to be used in the next processes. $students rows that do not have a datestamp higher than $timevar (thus, did not post in the last 24 hours) will be skipped over. 6. Create a running count { $count = $count + 1; We also want to know how many people have posted today, so this keeps track. Every time a record is found that meets the condition, $count (which initially starts at 0) goes up by +1. This works because it is located inside the foreach, and after the if -- which means that it runs every time a record is found that meets the conditions of the if. 7. Print the member list print "<a href='/profile/" . $students['member_id'] . "-" . $students['members_seo_name'] . "'>" . $students['prefix'] . $students['name'] . $students['suffix'] . "</a>, "; }} Again we're using the print function, this time to create a linked and styled list. It looks a touch confusing, and may help if formatted like this. print "<a href='/profile/" . $students['member_id'] . "-" . $students['members_seo_name'] . "'>" . $students['prefix'] . $students['name'] . $students['suffix'] . "</a>, "; }} Here you can see more clearly where HTML is enclosed in quotation marks, and where PHP variables are being used. PHP variables are being used to help create the link itself, by accessing the member_id and members_seo_name columns. You can see again how the column name is defined after $students to get the right piece of data, eg $students['name'] returns the name of the account, while $students['member_id'] returns the member's id number. You can also see how the PHP variables are used when HTML is also being used. If you just want to print the contents of a variable, normally you would use print $variable; But because we want to mix PHP and HTML output, we need to do things a little differently. Any PHP variable that is used between or after a HTML sequence needs to have leading and following full stops. For instance: print "some html" . $variable . "some more html"; 8. Print the count and close off print "<br><span class='resultxc'>" . $count . " members posted today</span><br>"; print "</div></div>"; This simply prints the $count variable (the number of total people that posted in the last 24 hours), and closes off the rest of the HTML used throughout the block. Who Posted Today -- Block Code /** * Build SELECT statement * * @param array|string $columns The columns (as an array) to select or an expression * @param array|string $table The table to select from. Either (string) table_name or (array) ( name, alias ) or \IPS\Db\Select object * @param array|string|NULL $where WHERE clause - see \IPS\Db::compileWhereClause() for details * @param string|NULL $order ORDER BY clause * @param array|int $limit Rows to fetch or array( offset, limit ) * @param string|NULL|array $group Column(s) to GROUP BY * @param array|string|NULL $having HAVING clause (same format as WHERE clause) * @param int $flags Bitwise flags * @li \IPS\Db::SELECT_DISTINCT Will use SELECT DISTINCT * @li \IPS\Db::SELECT_SQL_CALC_FOUND_ROWS Will add SQL_CALC_FOUND_ROWS * @li \IPS\Db::SELECT_MULTIDIMENSIONAL_JOINS Will return the result as a multidimensional array, with each joined table separately * @li \IPS\Db::SELECT_FROM_WRITE_SERVER Will send the query to the write server (if read/write separation is enabled) * @return \IPS\Db\Select * */ $rightnow = time(); $timevar = $rightnow - 86400; // Get the select object $select = (\IPS\Db::i()->select('member_id, prefix, suffix, g_id, name, members_seo_name, member_group_id, member_last_post', 'core_members' )); $select = $select->join( 'core_groups', 'core_members.member_group_id=core_groups.g_id', 'LEFT'); print "<div class='ipsWidget ipsWidget_horizontal ipsBox'><h3 class='ipsType_reset ipsWidget_title'>Who Posted Today</h3><div style='padding: 10px;'>"; foreach( $select as $students ) { if ($students['member_last_post'] > $timevar) { $count = $count + 1; print "<a href='/profile/" . $students['member_id'] . "-" . $students['members_seo_name'] . "'>" . $students['prefix'] . $students['name'] . $students['suffix'] . "</a>, "; }} print "<br><span class='resultxc'>" . $count . " members posted today</span><br>"; print "</div></div>";
×
×
  • Create New...

Important Information

By using this site, you agree to our Terms of Use, Guidelines and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.