Show the entries in alphabetical order in the WordPress loop

By default, the loop from WordPress will display your blog entries in chronologically inverse mode so that your last entry will be shown higher than the previous ones, but sometimes it may be interesting to skip this convention and display them alphabetically .

Either to create an alphabetical index where each entry is one of the definitions, or a glossary, or any type of publication that requires entries to be shown alphabetically is an option to take into account for the day you want to use this possibility in a project.

Category file in alphabetical order

An example would be to show some specific category in alphabetical order. For this we should edit the file of the template of the categories, normally category.php and add something before loop like this:

Cover in alphabetical order

On the other hand, if what you want is show the loop of the cover in alphabetical order instead of chronologically invers or, in this case what we will do is modify the main WordPress requests ( pre_get_posts and is_main_query ).

But in this case it is not necessary to edit the file with the loop cover but it is better to do it forcing the modification from a file of functions ]either an own plugin or the file functions.php of the active theme.

We did this by adding this to the chosen one:

This function will edit the main request before it is executed, and will make sure that wherever the main request of the entries, such as in index.php entries are shown alphabetically .

Loading …

may also help you:

Hide cover entries • WordPress Help

There are many reasons why you may want that certain entries are not shown on the cover in the loop of your WordPress site, either because the theme is not the usual or simply because you want to give a specific entry a concrete treatment.

But if this need will only arise on a specific occasion then nothing better than WP hide post a simple plugin that ] adds a new meta box to your ticket editor from which …

Only for the last two possibilities is it worth the plugin, but surely with all the options it offers you will be useful in more than a project.

Oh, and if you want you can also use the visibility options offered for pages, also very useful.

A different loop

 loop wordpress

The loop is the WordPress matrix but there are very few pages which make more use demanding of this module, today I will show you how to perform a somewhat different loop .

The image that you see below is part of one of the pages I administer and the loop is divided into 2, even though it is the same loop a first article that has a thumbnail defined of a particular size and is to the left, and the other items aligned to the right.

 loop -different "src =" "width =" 500 "height =" 332 "srcset =" https: // ayudawp .com / wp-content / uploads / 2013/09 / loop-different-500x332.png 500w, 696w "sizes =" (max-width: 500px) 100vw, 500px "/> </a></p>
<p style= Seeing it from pure HTML what we want to achieve is simple and straightforward.

Within your loop you will have to enter a code very similar to this, remember that this is an easy example to understand and can be improved.

Line number ] 11 asks about the following posts which are stored in positions 1, 2, 3, 4 that correspond to posts 2, 3, 4 and 5.

After performing all this, just make a hand CSS and go giving different styles to the classes highlighted-1 and highlighted-2.

It is all about opening and closing the layer according to the post that is showing, I give you these links where you can find more information on how to use IF or SWITCH .php

Esper and it will be very useful for you to start making modifications to your blog and your clients'.

NOTICE : this publication is from two years ago or more. If it's a code or a plugin it might not work in the latest versions of WordPress, and if it's a news story it might be obsolete. Then do not say we have not warned you.

Loading …

That may also help you:

Convert static HTML to WordPress

 html to wordpress

There are still many webs static in HTML maybe more than the recommendable ones, because until not many years ago it was the standard offered by developers all over the world.

Note: this entry contains affiliate links for which the author can charge commissions for each sale.

The main disadvantage of having a web static in HTML is that the content is, that same, static requiring the creation or express modification of the HTML to have new content, something already obsolete and in disuse with the introduction of content management systems (CMS).

If this is your case, and you have a static web in HTML with a lot of created pages do not worry because it is quite easy to pass content and design of HTML to WordPress . Let's look at the two issues you have to address.

1. Convert static HTML pages to WordPress

There is a previous step, and it is to install a WordPress to accommodate your pages in HTML. Once you have it there are several ways to move from HTML pages to entries (or pages) WordPress:

  1. Do it by hand . If you do not have many pages, do not complicate, simply copy and paste the text of the HTML page in the editor of WordPress entries and publish.
  2. URL cloner would be another option, because it is an incredible plugin allows import content from any URL to WordPress .
  3. HTML Import a simple plugin that, once active, offers you a wide page of settings to import any HTML web into WordPress. It is very accurate and effective.


My advice would be that do not complicate and install one of the thousands of wonderful WordPress themes that exist but if you have some special fondness for a previous HTML design there are some things that you must know.

2.1 Create the WordPress theme

The first thing is to create a folder and name it with the name of the theme you want. Then you have to create two new files, style.css e index.php and place them in that folder. They are the only files that WordPress needs, believe it or not. Now copy and paste the code of your original CSS file into the file style.css just created. At the beginning it adds the following:

These comments identify the theme how made for WordPress. Your stylesheet would be ready.

2.2 Dismantle the HTML

I could say it more finely but the reality is that a WordPress theme is a kind of quartered HTML or more finely put, " deconstructed ". By the way, we must incorporate the PHP calls that will make the HTML communicate with the database essential in any CMS to archive the dynamic information of the content.

The WordPress themes are several PHP files where there are calls that claim the code of the rest of files to show them in a certain order. The basic structure of a WordPress theme would be: header (header.php) that calls the content block (index.php) and this in turn to the sidebar of navigation resources (sidebar.php) for, in the end, close with an informative footer (footer.php).

WordPress, instead of having all this HTML code in a single file it " dismembered " in several that " they call "among them using PHP.

So, to start, you must go to your HTML code and add some marks in the 4 main places where you plan to make the code cuts for these 4 main sections. Of course, this assumes that your previous design contains those elements (header, body, sidebar and foot), but adapt it to what you have.

So, following the example, create 3 new files: header. php sidebar.php and footer.php and place them in the folder of the theme that you created earlier.

Before putting us check the code of the file header.php of the Twenty Ten theme that comes by default in any WordPress installation. Look at the PHP used between the tags . Copy this code into your new file header.php . Now open the original HTML and copy the code previously marked for the header (first section) in this file header.php just below section . Save and close

Now open the file index.php that you created at the beginning and copy the second section of your original HTML code that you marked as such before. Save and close too

We will do the same with the following sections in the new files sidebar.php and footer.php that we will create.

2.3 Adjust the machinery

] Once the above is done, your original HTML code should be already quartered in 4 different files (header.php, index.php, sidebar.php, footer.php). So now it's time to put them to work together using PHP lines.

Open the file index.php which should contain the HTML of the second section of your original code. Add this line to the beginning of all:

Now we go to the end of this same file and add the following: