Agave Plugins Header Logo

NPE Taxonomy Offsets

The argument taxonomy_offset_names= allows you to to have a page where you want to list posts from a certain taxonomy and have the first one major that is much larger than the rest. I'll add a tag called scenic-pictures.

[netsposts taxonomy='scenic-pictures' list='1']

And the second argument will show the next three with the following shortcode.

[netsposts taxonomy='scenic-pictures' list='3' taxonomy_offset_names='Scenic Pictures' taxonomy_offsets='1' taxonomy_offset_type='tag']

Note: taxonomy_offset_names uses the name or slug of the given taxonomy whether it be a tag or category.

Pacific
Published 4/4/2020 in Ocean Views
The Pacific Ocean is the largest and deepest of Earth's oceanic divisions. It extends from the Arctic Ocean in the north to the Southern Ocean (or, depending on definition, to Antarctica) in the south and is bounded by the continents of Asia and Australia in the west and the Americas in the east.read more ❯

Rocky Mountains
Published 4/4/2020 in Mountain Ranges of the World
The Rocky Mountains, also known as the Rockies, are a major mountain range located in western North America. The Rocky Mountains stretch 3,000 km (1,900 mi) in straight-line distance from the northernmost part of British Columbia, in western Canada, to New Mexico in the Southwestern United States. The northern terminus is near the Liard River, while the southernmost point is near Albuquerque, adjacent the Sandia–Manzano Mountains. Located within the North American Cordillera, the Rockies are distinct from the Pacific Coast Ranges, Cascade Range, and the Sierra Nevada, which all lie farther to the west.read more ❯
Rain Forest Water Falls
Published 4/3/2020 in Rain Forest Scenic Pictures
The Amazon is one giant rain forest, so it is not surprising that there are dramatic waterfalls throughout the region, particularly during the wet season. The contrast of cascading water, rocky outcrops and tropical greenery make Amazonian waterfalls a visual treat.read more ❯
Mojave
Published 4/4/2020 in Desert Landscapes
The Mojave Desert is situated in a transitional zone between the Great Basin Desert to the north and the Sonoran Desert to the south (mainly between 34 and 38°N latitudes). The Mojave Desert, a rain-shadow desert, is defined by a combination of latitude, elevation, geology, and indicator plants.read more ❯

With the help of a little CSS I'll make the first have a large image taking up the width of the page then a nice list below it. All CSS and shortcodes used will be included.

[netsposts shortcode_id='first_list_item' taxonomy='scenic-pictures' list='1' thumbnail='true' size='custom-size-1000' include_link_title='true' exclude_read_more_link='true']

I got the above size by adding the following line to the functions.php file or custom plugin. The method I suggest is to use the code snippets plugin.

add_image_size( 'custom-size-700', 700 ); // 700 pixels wide by unlimited pixels tall, no proportional crop mode

[netsposts shortcode_id='rest_list_items' taxonomy='scenic-pictures' list='3' taxonomy_offset_names='Scenic Pictures' taxonomy_offsets='1' taxonomy_offset_type='tag' thumbnail='true']

I guaranteed the large image to be responsive by adding the following to the cusomizer.

CSS code: img { max-width: 100%; height: auto; }

I want the titles to look the same on both so I'll target both of them by using the class in the body section of this page called page-id-484. So the shortcode will be as follows.

.page-id-484 .netsposts-posttitle-link { font-size: 28px; color: #800000; font-weight: 500; }

The first list (the list of one) will have no other CSS applied.

The second list I'm going to design with the help of the grid-container type of css. The only change is the image will be on the left and the excerpt on the right. Plus be responsive when you resize the screen. The complete CSS code is below.

.page-id-484 .netsposts-posttitle-link { font-size: 28px; color: #800000; font-weight: 500; }

.page-id-484 a:hover img { filter: grayscale(1); }
@media screen and (min-width: 481px) { #rest_of_items_list .netsposts-content { display: grid; grid-template-rows: auto; grid-template-columns: 150px auto; column-gap: 10px; }

#rest_of_items_list .netsposts-posttitle-link { grid-row-start: 1; grid-row-end: 2; grid-column-start: 1; grid-column-end: 3; }

#rest_of_items_list .netsposts-source { grid-row-start: 2; grid-row-end: 3; grid-column-start: 1; grid-column-end: 3; }

#rest_of_items_list .link-img-wrapper { grid-row-start: 3; grid-row-end: 4; grid-column-start: 1; grid-column-end: 2; align-self: center; }

#rest_of_items_list .netsposts-excerpt { grid-row-start: 3; grid-row-end: 4; grid-column-start: 2; grid-column-end: 3; align-self: center; } }

@media screen and (max-width: 480px) { #rest_of_items_list .netsposts-content { display: flex; flex-flow: column nowrap; }}

Pacific
Published 4/4/2020 in Ocean Views
Pacific Ocean Sunset
The Pacific Ocean is the largest and deepest of Earth's oceanic divisions. It extends from the Arctic Ocean in the north to the Southern Ocean (or, depending on definition, to Antarctica) in the south and is bounded by the continents of Asia and Australia in the west and the Americas in the east.
Rocky Mountains
Published 4/4/2020 in Mountain Ranges of the World
The Rocky Mountains
The Rocky Mountains, also known as the Rockies, are a major mountain range located in western North America. The Rocky Mountains stretch 3,000 km (1,900 mi) in straight-line distance from the northernmost part of British Columbia, in western Canada, to New Mexico in the Southwestern United States. The northern terminus is near the Liard River, while the southernmost point is near Albuquerque, adjacent the Sandia–Manzano Mountains. Located within the North American Cordillera, the Rockies are distinct from the Pacific Coast Ranges, Cascade Range, and the Sierra Nevada, which all lie farther to the west.
Rain Forest Water Falls
Published 4/3/2020 in Rain Forest Scenic Pictures
Rain Forest Waterfalls
The Amazon is one giant rain forest, so it is not surprising that there are dramatic waterfalls throughout the region, particularly during the wet season. The contrast of cascading water, rocky outcrops and tropical greenery make Amazonian waterfalls a visual treat.
Mojave
Published 4/4/2020 in Desert Landscapes
Mojave Desert
The Mojave Desert is situated in a transitional zone between the Great Basin Desert to the north and the Sonoran Desert to the south (mainly between 34 and 38°N latitudes). The Mojave Desert, a rain-shadow desert, is defined by a combination of latitude, elevation, geology, and indicator plants.

Later on I'll show you some really nice designs but for those of you who have knowledge in CSS you can make designs much better. Well this concludes the course on taxonomy offsets.