Guide

Rights / Headlines / Categories / Tags / Featured Images / Images / Filenames / Text Styling / Links / Embeds / Discourse / Proofreading / Publishing / Profiles / Challenges / Points / Badges / Brand / Styles / Helper Classes / Deleting

Anyone is welcome to join and contribute content to Techpost, even if you’ve never run your own blog or published anything you’ve written before. So long as you have a genuine interest in any of the many subjects that encompass technology, and can write fluently in English, anyone in the world, with any point of view, is welcome to submit content.

Concerning the content we’re willing to accept and publish, we’re pretty open-minded, and offer a lot of freedom. For the most part, you can write about what you like, when you like, and how you like, choosing your own headlines, content, and images. We care very deeply about freedom of speech, and will do our best to keep the platform fair, allowing people to share their opinions freely, even if we don’t agree with them or some people find them offensive.

That said, this isn’t an anything goes type of platform or publication. With kindness and respect, understanding each other should always be the goal when communicating. Within reason, we’ll allow most content, including: profanity, nudity, or even violent images if relevant, because these are all real parts of life, and as long as it’s legal in the United States (where we’re based and the laws of which we must abide) and as long as your words don’t cross a line to actually attack or violate the lives, privacy, or safety of others, we won’t censor you.

Free speech is a very complicated issue. Reviewing each submission, on a case-by-case basis, we promise to do our very best to do what’s right for knowledge and people as a whole, and not just what fits our or anyone else’s personal agenda.

Rights

Only original, unique, and exclusive content is allowed on Techpost. You will always remain the copyright holder and credited author of your content, but by publishing on Techpost, you’re granting us exclusive publishing rights to that content in the medium of websites. Accepted contributions are becoming an official part of the publication’s body of content.

Concerning the trademarks and copyrights of images that you use in your posts. There are thousands of great, high quality images out there that are completely safe to use under fair use, public domain, and other friendly licenses, without any copyright notice or attribution required. See Images below for some recommendations.

In rare circumstances, when sharing direct work from photographers or artists, you should reach out to them for permission and provide a credit link to their website, as a courtesy.

Headlines

Use title case only. This includes the title, subtitle, and content headers.

Categories

Select the most appropriate category from those available. One category is required, but you may select additional categories if relevant. If no appropriate category is available, you may suggest that we add one. Copy added categories over to tags as well.

Tags

Tags are required. Use lowercase only.

A featured image is required for all posts. It must be exactly 1920×1080 pixels.

Do not enlarge small images, distort wildly different aspect ratios to fit 1920×1080, or do anything else to hack an image into the required size, which degrades quality. Resizing large images down to 1920px wide and clipping the height down to 1080px or otherwise Photoshopping your own graphics are acceptable options.

Images

When adding images to a post, do not hotlink to them from other sites. You need to actually upload them to Techpost.

Add titles and alts (in title case) for all uploaded images. For example, if you uploaded an image with the filename brown-leather-chair.jpg, a good title and alt would be Brown Leather Chair. The title and alt should always be exactly the same, but in some circumstances, don’t necessarily need to match the filename exactly.

Optimize images for the web. Save images as .jpg (Quality 8 if using Photoshop). With a very minor (usually unnoticeable) difference in quality, you can take a 1mb .png down to a 200kb .jpg.

Pexels, StockSnap, Morguefile, and Flickr Commons are all great options for finding high quality images that are free to use without attribution.

Filenames

Filenames must be all lowercase, keyworded appropriately, with each keyword separated by a dash.

Example: brown-leather-chair.jpg

Text Styling

Major works like movie, TV show, book, and video game titles should be italicized with <em>…</em> tags. Minor works like chapter and song titles should be placed in “quotations.”

When creating comma-separated lists, use a series comma (commonly referred to as the Oxford comma).

Provide useful, informational, and source links (Wikipedia and IMDb for example) where possible to improve quality and credibility for readers.

Use the canonical (the official and clean) version of URLs only, removing any unnecessary parameters. Quickly find the canonical URL of a page you’re on with this Firefox add-on. Shortened links and affiliate links are not allowed. Don’t set links to open in a new window (this is handled automatically).

Embeds

You can embed YouTube videos, Twitter tweets, Kickstarter projects, and many other types of external content by simply pasting in their URLs to the post content area. WordPress will automatically handle the rest.

Discourse

Published posts automatically create a corresponding forum topic for discussion.

Proofreading

That means spellchecking, checking for grammatical issues, verifying definitions, and most importantly, previewing your content before submitting (or publishing).

First, it’s always good to look at everything visually to make sure it looks right and that nothing is broken.

Second, after doing one or two passes of critical reading (checking for errors), it’s always good to try a natural and casual read-through like you’re reading it for the first time to see how it flows, how it sounds.

Publishing

Click “Submit for Review” or “Publish” when ready. Just note that this process can sometimes hang. Do not leave the editor page until you receive the message that indicates it was successfully submitted or published.

New posts, once published, will automatically syndicate to the forum, social media, and email subscribers.

Once a post is published, do not unpublish it or alter its timestamp. However, you may of course update the live article to make any corrections, add new information, etc.

Profiles

Add your avatar, website, social media links, and bio from your Settings page. Avatars can be added via Gravatar (using the same email you use on Techpost) and should be perfectly square. 1200×1200 pixels is preferred. When adding social profile links, make sure to add the full URLs (not just the usernames), which means including https:// at the beginning of your URLs or your social profile links will be broken.

Challenges

Challenges come in all kinds of forms: contests, giveaways, Easter eggs, and other fun ways for the community to earn cash and points.

Points

Some ways of earning points include:

  • 100 Points: Publishing New Posts and Completing Surveys
  • 10 Points: Just for Joining
  • 1 Point: Visiting the Site and Logging In Daily

Badges

Badges are earned for completing certain tasks, winning competitions, and other achievments.

Brand

  • Name: Techpost (upper case “T” / lower case “p” / all one word)
  • URL: https://techpost.io/ (SSL / non-www)
  • Color: #9370DB
  • Logo: Preview | Download: .ai / .psd / .png
  • Icon: Preview | Download: .ai / .psd / .png
  • 1080: Preview | Download: .png

Styles

Note — Many of the below styles can also be mixed and matched in creative ways not demonstrated. For instance, adding a color class to different HTML elements.

The title of your post is the header one. So, for sub-headers within the content of your post, start with a header two.

This is a header two.

<h2>This is a header two.</h2>

This is a header three.

<h3>This is a header three.</h3>

This is a header four.

<h4>This is a header four.</h4>
This is a header five.
<h5>This is a header five.</h5>
This is a header six.
<h6>This is a header six.</h6>

For accessibility, SEO, and other factors, it’s important that headers and their hierarchy are used correctly. If you’re simply looking to style text larger for visual or creative purposes, don’t misuse header tags for this purpose. Instead, you can use the following method:

This is a visual simulation of header one.

<p class="h1">This is a visual simulation of header one.</p>

This is a visual simulation of header two.

<p class="h2">This is a visual simulation of header two.</p>

This is a visual simulation of header three.

<p class="h3">This is a visual simulation of header three.</p>

This is a visual simulation of header four.

<p class="h4">This is a visual simulation of header four.</p>

This is a visual simulation of header five.

<p class="h5">This is a visual simulation of header five.</p>

This is a visual simulation of header six.

<p class="h6">This is a visual simulation of header six.</p>

This is a sentence wrapped in paragraph tags. Unless you wish to explicitly declare and perhaps add a class to the paragraph tag, there’s no need to wrap paragraphs in tags as WordPress adds them automatically.

<p>This is a sentence wrapped in paragraph tags.</p>

This is a link.

<a href="#">This is a link</a>

This is bold text.

<strong>This is bold text</strong>

This is italic text.

<em>This is italic text</em>

This is code that we want to display: .blue{color:blue}

<pre><code>.blue{color:blue}</code></pre>

This is the horizontal rule:


<hr />

This is the special horizontal rule:


<hr class="special" />

This is a sentence wrapped in blockquote tags.

<blockquote>This is a sentence wrapped in blockquote tags.</blockquote>
  • This
  • is
  • an
  • unordered
  • list.
<ul>
<li>This</li>
<li>is</li>
<li>an</li>
<li>unordered</li>
<li>list.</li>
</ul>
  1. This
  2. is
  3. an
  4. ordered
  5. list.
<ol>
<li>This</li>
<li>is</li>
<li>an</li>
<li>ordered</li>
<li>list.</li>
</ol>

<input type="text" value="This is a text input." size="25" />

<textarea rows="5" cols="50">This is a textarea.</textarea>

<input type="submit" value="This is a submit input." />

This is an image.

<img src="https://techpost.io/uploads/tech.jpg" alt="This is an image." />

This is the default button.

<a href="#" class="button">This is the default button.</a>

This is a button set to white.

<a href="#" class="button white">This is a button set to white.</a>

This is a button set to blue.

<a href="#" class="button blue">This is a button set to blue.</a>

This is a button set to dark blue.

<a href="#" class="button blue-dark">This is a button set to dark blue.</a>

This is a button set to green.

<a href="#" class="button green">This is a button set to green.</a>

This is a button set to dark green.

<a href="#" class="button green-dark">This is a button set to dark green.</a>

This is a button set to orange.

<a href="#" class="button orange">This is a button set to orange.</a>

This is a button set to purple.

<a href="#" class="button purple">This is a button set to purple.</a>

This is a button set to red.

<a href="#" class="button red">This is a button set to red.</a>

This is a button set to yellow.

<a href="#" class="button yellow">This is a button set to yellow.</a>

This is a button set to black.

<a href="#" class="button black">This is a button set to black.</a>

This is a caution note.

<span class="note yellow">This is a caution note.</span>

This is a warning note.

<span class="note red">This is a warning note.</span>

 

This is a single-column box.
<div class="boxes">
<div class="box">This is a single-column box.</div>
</div>

 

This is a two-column box.
This is a two-column box.
<div class="boxes">
<div class="box-2">This is a two-column box.</div>
<div class="box-2">This is a two-column box.</div>
</div>

 

This is a three-column box.
This is a three-column box.
This is a three-column box.
<div class="boxes">
<div class="box-3">This is a three-column box.</div>
<div class="box-3">This is a three-column box.</div>
<div class="box-3">This is a three-column box.</div>
</div>

 

This is a four-column box.
This is a four-column box.
This is a four-column box.
This is a four-column box.
<div class="boxes">
<div class="box-4">This is a four-column box.</div>
<div class="box-4">This is a four-column box.</div>
<div class="box-4">This is a four-column box.</div>
<div class="box-4">This is a four-column box.</div>
</div>

 

This is a five-column box.
This is a five-column box.
This is a five-column box.
This is a five-column box.
This is a five-column box.
<div class="boxes">
<div class="box-5">This is a five-column box.</div>
<div class="box-5">This is a five-column box.</div>
<div class="box-5">This is a five-column box.</div>
<div class="box-5">This is a five-column box.</div>
<div class="box-5">This is a five-column box.</div>
</div>

 

This is a six-column box.
This is a six-column box.
This is a six-column box.
This is a six-column box.
This is a six-column box.
This is a six-column box.
<div class="boxes">
<div class="box-6">This is a six-column box.</div>
<div class="box-6">This is a six-column box.</div>
<div class="box-6">This is a six-column box.</div>
<div class="box-6">This is a six-column box.</div>
<div class="box-6">This is a six-column box.</div>
<div class="box-6">This is a six-column box.</div>
</div>

 

This is a one-thirds box.
This is a two-thirds box.
<div class="boxes">
<div class="box-1-3">This is a one-third box.</div>
<div class="box-2-3">This is a two-thirds box.</div>
</div>

 

Helper Classes

.left{text-align:left}
.center{text-align:center}
.right{text-align:right}
.float-left{float:left}
.float-right{float:right}
.clear{clear:both}
.clear-left{clear:left}
.clear-right{clear:right}
.clear-float:after{display:table;content:'';clear:both}
.offset{padding-top:110px;margin-top:-110px}

 

Deleting

While Techpost offers an unprecedented amount of freedom, making us more like a personal blogging platform (similar to medium.com or wordpress.com), we’re not. We’re something of a hybrid, but ultimately, we are a publication. That means that like a traditional publication (like a magazine), once submissions are published, they’re now officially set in print so to speak, and part of the archival content of Techpost.

That said, we’re not a print publication; we’re a digital publication, which means things can and sometimes should be anonymized, redacted, or completely deleted. You always have the right to either anonymize your account and have it completely deleted. The same goes for comments. However, for articles, we should always try our best to find creative solutions including editing, redacting, or anonymizing content, as opposed to completely deleting it.

Completely deleting content is disruptive to us and readers alike, but if there is a good reason, we may be able to accommodate. If you can, from the same email that you used to register your Techpost account with, send your request:

Delete Me


If you’re ever confused about any of these guidelines, would like certain documentation to be improved, or have requests for new features, don’t hesitate to ask or submit a public request.