Galaxie Blog HTML5 Grid Interfaces
Galaxie Blog uses a customized version of jsGrid, a lightweight client-side data grid to find and edit records when administrating the blog. These grids support grid operations like inserting, filtering, editing, deleting, paging, and sorting records, and it is fully customized to match the Galaxie Blog themes. JsGrid has no license restrictions and is fully open-sourced and uses the MIT license.
There are many integrated grids in the Galaxie Blog Administrative site. These grids manage:
- Users and user login history
This customized version of jsGrid is quite different than the official version and has been heavily customized to match the Galaxie Blog themes.
All of the grids can be sorted and most columns support search operations. To sort a column, simply click on the column header at the top of the grid.
The search capabilities are available by typing in a string right underneath the column header and clicking on the search icon in the grid control to the right. The search is case-insensitive and it will match any word that you type into the search field. For example 'Greg' will match 'Gregory'. This is quite useful to find records that you want to edit. Simply type in one or two words for the text that you want to find.
Opening up the detail interfaces from the grid
Most of the grids are used to display interfaces to edit the detail record. For example, to pull up a post that you want to edit. To open up the detail interface, click on the links within the cells to the left side of the grids. Not all grids have a link to the detail editor, for example, the category grid. Categories don't have enough metadata to support a dedicated detail interface, only the category and alias exist, and all of these editing tasks can be performed within the grid.
All of the grids support basic editing. While there are some things that require a dedicated interface, such as editing a post, there are some time-saving editing features built into the grids. For example, you may quickly delete records without having to click on a link to open up a separate interface just to delete something.
To quickly perform edits in an editable column in the grid, click on the edit button at the far right end of the row. After clicking the edit button the editable fields will be displayed. Change the value of one of the fields, and click on the checkmark button to save the record. This is a very fast process and you can immediately move the next record that you want to edit.
Most of the grids allow you to delete records. Don't be afraid of accidentally hitting the trash can icon which will delete something- you will always receive confirmations before Galaxie Blog deletes anything.
The Category Grid is used to create and manage existing categories. These categories are used to help categorize your posts.
Adding a new category is easy, click on the Add Category button, type in a category, and click submit.
The Category Grid contains the following categories: Category, Alias, Post Count, and Date. The category alias is the link that will be shown in the URL. All of the columns are sortable and searchable.
This grid does not have any links to pull up a category detail interface.
The Font Grid is used to manage and create new fonts. There are a lot of font properties and most of the time you will be either creating or finding a font to open the Font Detail Interface.
To create a new blog font, click on the Add New Font button and follow the directions on the screen, or see How to Create New Fonts below.
Currently, we are only supporting woff2 font uploads. This interface will be improved in upcoming versions to support more font types. We also intend on supporting google fonts in the future.
The font name, weight, italic, websafe and use font columns are editable. Other than the Use Font checkbox, all of the other fields are used for display purposes. We will explain the Use Font functionality below.
The Web Safe Font checkbox is used to determine if this font is web safe and available across all browsers. Clicking on this checkbox will activate the font in the Post Editor. Be sure that it really is a web-safe font however, if it is not there will be browser errors.
A font can be assigned to the page body, the title header, and the menu script at the top of the page. Fonts can also be used when making a post in the post editor. You can preview the font by opening up the Font Detail interface before assigning a font to a content block.
if you have assigned a font to a content block using the theme interface, you don't need to load the font in your code, it will be loaded automatically.
If you want a non-web-safe font that is not assigned to a content block to be available in the Post Editor, click on the 'Use Font' checkbox to load the font automatically. However, be aware that loading too many fonts will slow the page down as they consume resources to load.
The Post Grid is going to be the grid that you will most likely use the most while administrating your blog site.
To add a post, click on the Add New Post button within the grid, or on the Administrative site, select a date and time, choose the author, type in the title and description fields, and click submit.
The Post Grid contains the following columns: Author, Title, Post, Date Posted, and Released.
The search functionality will be used quite a bit here. Like all of the grids, typing in one or two words in the Title or Post search field will retrieve all records that match the search words. Searching the Post column for example will search the entire contents of the post.
You can edit the Released property by clicking on the checkbox. Releasing a post will release the post to the public.
To open up the Edit Post Interface, click on one of the links in the Post or Title columns.
The Subscriber Grid is used to display and edit your subscribers. There is no need for a detailed interface here.
The email, token, and verified columns are editable.
When a user subscribes to your blog, they are sent an email asking for them to confirm their subscription. This is known as a 'double opt-in' and is recommended practice. Once the user confirms via email, the Verified checkbox will become checked.
However, the blog administrator can automatically verify the subscribers by clicking on the verified checkbox. This feature is available as sometimes the subscribers provide their email address in person, or ask the administrator to subscribe for them.
The Theme Grid is mainly used to edit the theme details using the Theme Settings Interface. Click on the link in the Theme Name column to open this interface.
To create a new theme click on the New Theme button at the top of the grid.
The Edit Theme Interface will be displayed asking you to enter a new theme name and select a theme that is the closest match to the theme that you want to create.
When selecting the theme that you want to start from, pay attention to the primary colors of the buttons, logos, and the color at the top of the blog post calendar icons when copying an existing theme. You will want to try to match these primary accent colors when choosing new backgrounds and Logos for your new theme.
Once you have entered the new theme name and have selected the current theme, click on the submit button to open the Edit Theme Setting interface. This interface will be covered in future posts.
The Modern Theme, Use Theme, and Selected Theme columns in the grid are editable.
The Modern Theme checkbox is used to set the theme type. The modern theme removes the sidebar to the right of the blog and condenses the content in the center of the page. If this is unchecked the theme is the classical theme type. Classic themes are useful when you want advertisements to be displayed on the right side of your page.
Use Theme will make the theme available to a blog post and be available in the menu. Unchecking this checkbox will remove the theme from the blog.
To make one of the themes your only default theme, click on the selected theme checkbox. Themes that are enabled with the Use Theme checkbox will still be available on the menu at the top of the page.
The users' grid is used to create and edit users.
To create a new user, click on the Create New Users button at the top of the grid.
You will need to enter in the user's information, such as their name and email address. The password that you set will not be the user's eventual password. It is only used to initially log the user in once they receive an automated email.
Once a new user has been made, a branded email will be sent to the user asking them to fill out their own user profile and select their own password. The new user will also have to fill out some secret questions like their favorite pet and place. These questions are only used if the user forgets their password. The user's password or their answers to the questions are not available to the blog administrators.
You will also set the intended role of the new user. There are various built-in Galaxie Blog roles that will be discussed in future blog posts.
You can use the grid to set the first and last names of the user.
To view or edit user details, click on the link in the user name to open up the Edit User Interface.
Blog Administrators can view the user's login history. This grid will display the user's IP Address, User-Agent, and the date and time that they have logged in. This grid is mainly used to determine if there may have been a security intrusion. There are no editable fields or detail pages associated with this grid. Only the selected user and users with the blog administration role will be able to view this grid.
This entry was posted on May 13, 2022 at 10:29 PM and has received 281 views.