PX Magz

PX Magz ships with the demo site of a weekly magazine: a front page, nine sections with their subsections (World, Culture, Food & Drink, Ideas, Nature, Home & Style, Health, Travel, Sport), photo stories, podcasts, writers, newsletters and more than 220 stories. Stories are ordinary Joomla articles in categories; the page sections are modules you can edit.

• 4 template styles: front page, sections, articles and plain pages.
• T4 Framework: logo, fonts, colours, megamenu and layouts on one settings screen with a live preview.
• 20 story list layouts for article modules and 9 article layouts.
• 6 PX Content blocks made for this template: issue cover, adverts, events, people, newsletter, social links.
• Fields for section colours, galleries, videos, podcasts and author profiles.
• AcyMailing newsletter sign-ups, styled to match.

Quick start in 5 steps

1. Install the quickstart on your hosting.
2. Put in your logo and brand colour.
3. Rename the sections (categories) to yours and give each its accent colour.
4. Add your writers as users with a profile, then publish your own stories.
5. Set the sender address of your newsletters.

What you can download:

System requirements

• Joomla 6.x
• PHP 8.3 or later
• MySQL 8.0.13+ or MariaDB 10.4+
• Apache 2.4+ or Nginx 1.21+

Install the quickstart

1. Download the PX Magz Quickstart from your account on thepixel.dev.
2. Create an empty database and a database user on your hosting.
3. Upload the zip to the folder where the site will live, and extract it.
4. Open your domain in the browser. The Joomla installer starts.
5. Fill in the site name, your admin account and the database details, then click Install Joomla.
6. When the installer finishes, click Remove "installation" folder.

The quickstart already contains the T4 Framework, the PX Content module, AcyMailing and all demo stories and images. You do not need to install anything else.

Install on an existing site

Install the packages in this order through System » Install » Extensions » Upload Package File:

1. T4 Framework plugin (the template needs it to run).
2. PX Magz template.
3. PX Content module.

AcyMailing is optional: install it from acymailing.com if you want the newsletter form. A manual install gives you the template, but not the demo stories and modules: build your pages with the steps in Set up your pages.

Choose the style of a page in its menu item (Template Style on the Details tab). Open a style to reach the T4 settings: Site Settings, Navigation, Theme Color, Layouts and Global Settings, with a live preview.

Logo, fonts and colours

• Site Settings » Logo Settings: your logo (the demo logo is templates/px_magz/images/logo/px-magz-logo.svg).
• Typography: the demo uses Archivo for text and Newsreader for headings; a section can switch its headings with the Heading voice field.
• Theme Color: the brand red of buttons and the ink and paper tones. Each section can override its accent, see Sections.

Your own CSS

Use Tools » Edit Custom CSS for small design changes. Your CSS is kept when you update the template.

The front page is built from modules. Most are Articles modules with a PX Magz layout (Advanced » Layout), so they fill themselves from your stories.

Story list layouts

Articles modules can use these layouts: lead, latest, popular, ticker, slider, mega, more and the section layouts cat-live, cat-mosaic, cat-feature, cat-wall, cat-scroller, cat-columns, cat-center, cat-side, cat-tiles, cat-spot, cat-spot-stack, cat-desk, cat-four, cat-photos. Choose the category, number of stories and ordering on the module's Module tab.

• Sections are top-level categories with a Category Blog menu item and the Section style; subsections are child categories. In the category's Fields tab, Accent colour sets the section colour used by labels and lines; Page tone and Featured arrangement change the section page.
• The All stories menu items use the river layout: every story of a section, newest first.
• In Pictures uses the photos layout; a photo story fills the Photo gallery field (photo and description per frame).
• Podcasts uses the podcasts layout; an episode fills Show, Episode and Length (minutes).
• A story with a YouTube or Vimeo link in its Video URL field shows the player at the top.
• Each story can use another article layout (cover, poster, split, photo, inline, left, type) in its Options » Layout.

Writers

Bylines come from the article's author. Give each writer a Joomla user with the Role, Bio and Portrait fields filled in (Users » Manage » Fields): they show in the author box under each story and on the Our writers page. The demo writers are blocked users that cannot log in; replace them with your own.

Edit texts on the page

1. Log in on the site.
2. Click Edit content at the bottom right of the page.
3. Double-click a text to change it. Use the small toolbar for bold, italic and underline. Press Ctrl/⌘+Enter to save.
4. Pick a new picture from the Media Manager, or open Settings for the other options of a block.
5. Click Done when you are finished.

The sign-up forms are AcyMailing subscription modules (newsletter-form, footnav-4, the article sidebar). Before you send anything, open Components » AcyMailing » Configuration, set your From and Reply to addresses (the quickstart uses This email address is being protected from spambots. You need JavaScript enabled to view it.) and the sending method, then send yourself a test.