Click here to Skip to main content
Click here to Skip to main content

Tagged as

Tips and Tricks for CodeProject.com

, 7 Jan 2014
Rate this:
Please Sign up or sign in to vote.
A community wiki of tips, features and easter eggs on CodeProject.com

Introduction

Over the years features, shortcuts and outright Easter Eggs have made their way into the CodeProject.com system. As tricks and tips are added or discovered please add them here.

Your account

  • Include an account summary in your blog or website using the following
    <iframe src="http://www.codeproject.com/members/flair/<memberID>" height="200" width="350" scrolling="no" frameborder="no"></iframe>
    where memberID is your membership ID.

    Using http://www.codeproject.com/members/flair/1 (ie ID = 1) will show:


     
  • Customise your profile page by going to My Settings, choosing "Customisation" and adding some CSS to be applied to your profile page. Take care though - no returns or refunds if you break your profile page!

Articles 

  • When including code samples within the article text you can provide the same code sample in multiple languages and have them displayed as a neat set of tabs, one tab per language. To do this, post your code samples on after the other, then wrap all the sames in a DIV with class "code-samples". eg
    <div class="code-samples">
    <pre lang="C#">
    ...
    </pre>
    <pre lang="VB.NET">
    ...
    </pre>
    </div>
  • When including code samples you can have line numbers automatically included be adding linecount="on" to the PRE tag. If you want to start the numbering at a specific line, use countstart="<start>", and to set the line count increment use countincrement="<increment>". eg
    <pre lang="aspnet" linecount="true">
    or
    <pre lang="vb" linecount="true" countstart="10" countincrement="10"> 
  • You can use MathML or TeX in your articles via MathJax.

    Enclose your mathematics within a tag of class "math" and use $...$ to wrap equation blocks and  (...) to wrap inline equations.  eg <div class="math">$...$</div>, and wrap an inline equation with <span class="math">(...)</span>.

    For example:
    <div class="math">
    $\begin{aligned}
    \dot{x} & = \sigma(y-x) \\
    \dot{y} & = \rho x - y - xz \\
    \dot{z} & = -\beta z + xy
    \end{aligned}$
    </div> 
    will render as
    $\begin{aligned} \dot{x} & = \sigma(y-x) \\ \dot{y} & = \rho x - y - xz \\ \dot{z} & = -\beta z + xy \end{aligned}$

    and

    The solution is <span class="math">(y = x^2 \hbox{ when x > 2})</span>

    will render as

    The solution is (y = x^2 \hbox{ when x > 2})

CSS

  • When posting a table, you can apply CSS classes:
    <table class="simple" cellspacing="0" cellpadding="0">
    <thead>
    <tr><td>Col 1</td><td>Col 2</td><td>Col 3</td></tr>
    </thead>
    <tbody><tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>A</td><td>B</td><td>C</td></tr>
    </tbody></table>

    Result:

    Col 1Col 2Col 3
    123
    ABC
    <table class="themed" cellspacing="0" cellpadding="0">
    <thead>
    <tr><td>Col 1</td><td>Col 2</td><td>Col 3</td></tr>
    </thead>
    <tbody><tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>A</td><td>B</td><td>C</td></tr>
    </tbody></table>

    Result:

    Col 1Col 2Col 3
    123
    ABC
    <table class="feature" cellspacing="0" cellpadding="0">
    <thead>
    <tr><td>Col 1</td><td>Col 2</td><td>Col 3</td></tr>
    </thead>
    <tbody><tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>A</td><td>B</td><td>C</td></tr>
    </tbody></table>

    Result:

    Col 1Col 2Col 3
    123
    ABC
    <table class="grid" cellspacing="0" cellpadding="0">
    <thead>
    <tr><td>Col 1</td><td>Col 2</td><td>Col 3</td></tr>
    </thead>
    <tbody><tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>A</td><td>B</td><td>C</td></tr>
    </tbody></table>

    Result:

    Col 1Col 2Col 3
    123
    AB


    And also sidebar classes:
    <div class="sidebar-left">This isa sidebar</div>
    
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse commodo arcu eget scelerisque ultricies. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut erat nisl, faucibus eleifend ultricies sit amet, aliquam vitae velit. Nunc feugiat gravida convallis. Ut quis odio rhoncus, facilisis quam at, aliquet velit. Aliquam nec bibendum nulla, quis sollicitudin felis. Maecenas vitae auctor augue, consequat placerat odio. Mauris ac vulputate nisi. Morbi quis enim aliquam, iaculis eros non, vulputate nibh
     
    <div class="sidebar-right">This isa sidebar</div>
    
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse commodo arcu eget scelerisque ultricies. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut erat nisl, faucibus eleifend ultricies sit amet, aliquam vitae velit. Nunc feugiat gravida convallis. Ut quis odio rhoncus, facilisis quam at, aliquet velit. Aliquam nec bibendum nulla, quis sollicitudin felis. Maecenas vitae auctor augue, consequat placerat odio. Mauris ac vulputate nisi. Morbi quis enim aliquam, iaculis eros non, vulputate nibh

The forums

  • When posting a message that mentions another user, you can reference that user using @user-name or @[Display Name] in the message. The reference will be automatically linked to their profile and an email will be sent to them alerting them that they have been mentioned
     
  • When referring to a CodeProject article in a message, just paste the URL of the article into the editor and it will be replaced with a link to the article, with the message text set as the title of the article.
     
  • Use keystrokes to navigate: Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages
     
  • If Profile popups are enabled (at the top of the forum - check the "Profile Popup' checkbox and click update) then when you hover over a name you see their profile summary
     
  • Get a daily summary of the new posts to a forum by clicking the "Subscribe" button at the top right of each forum

Surveys

General 

  • Konami code. This is left as an exercise for the reader.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Chris Maunder
Founder CodeProject
Canada Canada
Chris is the Co-founder, Administrator, Architect, Chief Editor and Shameless Hack who wrote and runs The Code Project. He's been programming since 1988 while pretending to be, in various guises, an astrophysicist, mathematician, physicist, hydrologist, geomorphologist, defence intelligence researcher and then, when all that got a bit rough on the nerves, a web developer. He is a Microsoft Visual C++ MVP both globally and for Canada locally.
 
His programming experience includes C/C++, C#, SQL, MFC, ASP, ASP.NET, and far, far too much FORTRAN. He has worked on PocketPCs, AIX mainframes, Sun workstations, and a CRAY YMP C90 behemoth but finds notebooks take up less desk space.
 
He dodges, he weaves, and he never gets enough sleep. He is kind to small animals.
 
Chris was born and bred in Australia but splits his time between Toronto and Melbourne, depending on the weather. For relaxation he is into road cycling, snowboarding, rock climbing, and storm chasing.
Follow on   Twitter   Google+   LinkedIn

Comments and Discussions

 
NewsTips from the founder himself! Pinprofessionalroscler29-Jan-14 2:31 
SuggestioniFrame not supported in WordPress.com Free Blog PinmvpTadit Dash6-Jan-14 23:11 
GeneralRe: iFrame not supported in WordPress.com Free Blog PinmemberMaster.Man19807-Jan-14 5:28 
GeneralRe: iFrame not supported in WordPress.com Free Blog PinmvpTadit Dash7-Jan-14 6:28 
GeneralRe: iFrame not supported in WordPress.com Free Blog PinmemberMaster.Man19807-Jan-14 7:20 
AnswerRe: iFrame not supported in WordPress.com Free Blog PinmvpTadit Dash7-Jan-14 7:30 
GeneralRe: iFrame not supported in WordPress.com Free Blog PinadminChris Maunder7-Jan-14 7:49 
GeneralRe: iFrame not supported in WordPress.com Free Blog PinmvpTadit Dash7-Jan-14 7:54 
GeneralNice! PinmemberHerbert Lausmann3-Jan-14 1:23 
GeneralMy vote of 5 PinmemberMaster.Man19802-Jan-14 8:16 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web04 | 2.8.140827.1 | Last Updated 7 Jan 2014
Article Copyright 2014 by Chris Maunder
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid