Gregory's Blog

Enabling Search Engine Friendly Links with Url Re-write in Galaxie Blog


To enable search engine-friendly URL's in Galaxie blog, follow the steps below.

  1. If you're using IIS, the following rule should be copied and pasted into the web.config in the root directory on your web server. The URL redirection rule is between the rewrite tags below. It essentially matches all strings with 'index.cfm', and removes this string. Additionally, it sets a permanent redirect that the search engine uses when crawling your page.  If you're using a different web server, see the links at the bottom of this article or consult with your server administrator. 
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <directoryBrowse enabled="false" />
        <urlCompression doStaticCompression="true" doDynamicCompression="true" />
		<rewrite>
		<rules>
		    <rule name="GregorysBlog" stopProcessing="true">
                        <match url="(.*)index.cfm" />
                            <conditions logicalGrouping="MatchAll">
                                <add input="{SCRIPT_FILENAME}" matchType="IsFile" negate="true" />
                                <add input="{QUERY_STRING}" pattern=".+" ignoreCase="false" negate="true" />
                        </conditions>
                        <action type="Redirect" url="{R:1}" appendQueryString="true" redirectType="Permanent" />
                  </rule>
	    </rules>
	</rewrite>
        <security>
            <requestFiltering>
                <fileExtensions>
                    <add fileExtension=".pl" allowed="false" />
                </fileExtensions>
            </requestFiltering>
        </security>
        <httpErrors errorMode="Detailed" />
        <staticContent>
            <remove fileExtension=".woff2" />
            <mimeMap fileExtension=".woff2" mimeType="font/woff2" />
            <remove fileExtension=".webp" />
            <mimeMap fileExtension=".webp" mimeType="image/webp" />
        </staticContent>
    </system.webServer>
</configuration>
  1. Log into the Galaxie Blog Administrator and click on the Blog options icon. 
  2. Check the Server Rewrite Rule in place checkbox.
  3. Click on the submit button at the bottom of the page.

That's it! Your blog should now be using search-friendly URLs.

Credits:

  • I especially want to thank Caleb C. from Hostek for helping me get the IIS rule straight. The folks at Hostek have been nothing but outstanding in their service and support!

Further Reading:

This entry was posted on April 26, 2022 at 7:24 PM and has received 981 views.

Extending Application.cfc's using mappings and proxies


This is a rather long article, if you want to jump to the condensed summary, scroll down to the bottom of this page. Many years ago, the first time that I tried to perform this, I received the following message no matter what I tried: "Could not find the ColdFusion component or interface xxx'. In a nutshell, the problem using this approach is that both the root and the subfolders have the same name, i.e. Application.cfc, and ColdFusion can't properly identify what component to extend. Finally, after some serious investigation, someone came up with the idea to create a proxy.cfc that resides in the same root directory as the root Application.cfc, and the Application.cfc in the subfolder extends an empty proxy.cfc that extends the root cfc like so:
root directory: Application.cfc
This root Application.cfc does not extend anything

Also in the root directory: Proxy.cfc
Proxy.cfc has the following code, its essentially empty. The only thing that the Proxy.cfc does is to extend the Application.cfc that is in the same directory:
<cfcomponent extends="Application">

</cfcomponent>


Subdirectory such as a folder named admin.
This subdirectory has another Application.cfc. Let's say that this component is responsible for securing the application and has login logic as well as debugging settings for example. This Application.cfc will extend the Proxy.cfc to gain the methods and properties of the Application.cfc in the root directory like so:
<cfcomponent displayname="Admin" extends="Proxy.cfc">
<!-- Lots of code --->

</cfcomponent>

This approach was a godsend and it was heavily blogged about. Ben Nadel has made a number of very helpful posts which I will share at the bottom of this article. This works quite well unless you're on a hosted domain or a server that uses virtual directories. In this case, we are in the same original boat in which we started from. Now we are back into the "Could not find the ColdFusion component or interface xxx' hell! There is a solution for this tricky problem though, we need to also use mapping! It is a common misnomer that you can't use mapping to extend components. I am not quite sure where this misconception originally came about, but it has been proven that this is just not true. There are occasions where we must use mapping to solve some annoying problems, like here. This particular site is hosted by hostek.com. They are a fine company to deal with, but the server that my site is hosted on has some idiosyncrasies due to the directory structure. Here, when I use the Proxy.cfc method to extend the logic from the base Application.cfc to the Application.cfc in the admin folder I receive the dreaded 'could not find the ... component' error. When I first saw it I was dismayed thinking not this again, so I turned to ColdFusion CFC mapping. Mapping tells ColdFusion where to find the file and what the file relationships are.
Let's review CFC structure that was just discussed. For example, imagine the following directory structure:
root directory: i.e. www.gregoryalexander.com/
subdirectory: www.gregoryalexander.com/admin/
As discussed, we have an Application.cfc and the Proxy.cfc in the root directory, and we have the Application.cfc in the 'admin' subdirectory. The Proxy.cfc extends the Application.cfc, also in the root directory, and the Application.cfc in the subdirectory (admin) extends the Proxy.cfc in the root directory. root directory: contains both Application.cfc and Proxy.cfc (that extends the root Application.cfc).
subdirectory: Application.cfc (that extends Proxy.cfc).
Now we need to also add the following mapping in the root Application.cfc. This mapping logic should be near the top of the root Application.cfc, and it should not be within any of the Application.cfc event handlers (onApplicationStart, onApplicationRequest, etc). This mapping code does not need to be anywhere else other than the root Application.cfc:
<!-- Define application-specific mappings. These will be used to point to this application.cfc when we extend it in the admin/Administrator.cfc template using the Proxy.cfc that resides in the same folder as this Application.cfc. --->

<cfset this.mappings="structNew()" />
<!-- Mapping for the ROOT Application.cfc --->

<cfset this.mappings["rootCfc"]="getDirectoryFromPath(getCurrentTemplatePath())" />
<!-- Mapping for the admin SUBDIRECTORY Application.cfc. Note the admin prefix is attached at the end of this line. This points to the admin folder. --->

<cfset this.mappings["adminCfc"]="getDirectoryFromPath(" getCurrentTemplatePath()="" &="" "="" admin"="" )="" />
I used rootCfc to identify the Application.cfc in the root directory, whereas adminCfc applies to the Application in the admin directory. These variables can be named anything. Note that the "/admin" string at the end of the adminCfc mapping points to the 'admin' folder, which is a subdirectory. Now that we have the mappings in the root Application.cfc, we need to apply them to the extends statement in Application.cfc located in the subdirectory. In the /admin/Application.cfc template use:
/admin/Application.cfc
<cfcomponent displayname="xxx" sessionmanagement="xx" clientmanagement="xx" extends="rootCfc.Proxy">
<!-- Logic --->

</cfcomponent>
Of course, rootCfc tells the Application.cfc in the subdirectory to look for the Proxy.cfc template in the root directory. Like other 'extend' statements, you don't need to specify '.cfc' at the end of Proxy. You don't need to use this 'extend' mapping in either the root Proxy.cfc or Application.cfc templates. They can already find each other as they are both in the same root directory. /Proxy.cfc
<cfcomponent extends="Application">

</cfcomponent>

Summary

For the sake of absolute clarity:
root Application.cfc
Contains the mapping logic. Has the mappings for both of the root and subdirectory.
This mapping logic should be near the top of the root Application.cfc, and it should not be within any of the Application.cfc event handlers (onApplicationStart, onApplicationRequest, etc).
Does not use an 'extend' statement
<cfset this.mappings="structNew()" />

<cfset this.mappings["rootCfc"]="getDirectoryFromPath(getCurrentTemplatePath())" />

<cfset this.mappings["adminCfc"]="getDirectoryFromPath(" getCurrentTemplatePath()="" &="" "="" admin"="" )="" />
root Proxy.cfm
A simple 'extends="Application" works.
No mapping logic.
<cfcomponent extends="Application">

</cfcomponent>
subdirectory Application.cfc
The extends statement must be the mapping variable name of the folder (rootCfc), a dot (.), and finally the name of the Proxy.cfc template without the .cfc prefix (Proxy)
No mapping logic.
<cfcomponent displayname="Admin" sessionmanagement="yes" clientmanagement="yes" extends="rootCfc.Proxy">

</cfcomponent>
My apologies for being so verbose. I annoyed myself while writing this- but not as annoyed when I was while trying to solve this problem! Take care! Related External Posts:

This entry was posted on January 30, 2021 at 12:31 AM and has received 870 views.

How to make the perfect social media sharing image - part 6 Validation tools and tips


In this last post in this series, I will provide links to some social image sharing validator tools and provide a few tips and tricks that I learned along the way. After creating the proper social media images and fine-tuning the social media meta tags that are required, you can validate how each site will display your page using the tools below. Facebook Sharing DebuggerThe Facebook Sharing Debugger will validate your og meta tags and scrape the social media image. it's relatively straightforward to use. Just enter the URL of the page that you want to validate, and the debugger will scrape your page and show you if any errors were made. When you first enter the URL, it will take several seconds to generate the page, and if this page was not shared before, it will prompt you to fetch new information. Click on the button to fetch new information, and the debugger will list out data along with error information. The debugger will not immediately generate the Facebook sharing preview as it is crawling your page in the background, wait several minutes and refresh the page, and the image preview should be displayed. If you have errors indicating that you have missing tags, you can ignore these, as long as you have all of the essential tags. If you don't like the look of the images, you can make some changes, but come back here and regenerate the preview on the pages that you have shared the URL. If you're using Galaxie Blog, I have a utility tool in /common/utilities/cfimage.cfm that will allow you to reprocess the images quickly. For non-Galaxie Blog users, I have provided instructions below, and I placed the utility script on Git hub. Twitter Card ValidatorThe Twitter Card Validator is a bit easier to use, and it responds faster than the Facebook Sharing Debugger. Like Facebook, all that you need is to input your URL. After entering the URL, Twitters tool should immediately display your page preview. However, it is not easy to change the appearance of the preview after it has been made. I'll show you some tricks to re-create the preview. How to Regenerate a Twitter PreviewTwitter will cache your preview once the page has been shared, or a Twitter Card Preview has been made. However, it can be quite problematic to refresh the cache once made. I learned a few tricks and will show you a bulletproof way to change your preview if you have to make any changes. Go to the Twitter Open Graph meta tags in your page. Append something unique on the twitter:image tag like so. If you're using ColdFusion you can simply create a UUID. Other languages have the same capabilities. All you need to do is make sure that the URL is unique.

meta name="twitter:image" content="https://gregoryalexander.com/blog/enclosures/twitter/toby.jpg?id=#createUuid()#"

Once you have made the URL to the image unique, Twitter thinks that you have changed the image entirely, and will clear the cache and refresh the preview. Note: you'll have to get a Facebook and Twitter Developer Account to use these tools. Creating Social Media ImagesI have put a cfimage.cfm templateon GitHub for you to generate Social Media Images. I use this to generate social media images for my older posts. The usage is pretty simple. Upload the cfimage file to your server. then drop the original image in a enclosures folder, and create two new folders within the enclosures folder named twitter and facebook. In the socialMediaImagePath variable, put in the full image path for the type of image that you want to create. Go to the URL of your cfimage.cfm template with a browser, and the images will be saved underneath the '/enclosures/facebook' or '/enclosures/twitter' folders.

<!-- This is the only line that you should adjust --->
<cfset socialMediaImagePath="D:homegregorysblog.orgwwwrootenclosuresDSC_0518.JPG">
<!-- Consume the createSocialMediaImages(socialMediaImagePath, socialMediaImageType) function --->	
<cfset createSocialMediaImages(socialMediaImagePath,="" 'facebook',="" '')="">
<cfset createSocialMediaImages(socialMediaImagePath,="" 'twitter',="" '')="">

Other Social Media ValidatorsThere are other tools for validation for different media platforms, such as Twitters Post Inspector, and Pinterest Rich Pin's Validatorthat I will cover at a different time. Happy Coding!

This entry was posted on November 4, 2019 at 5:40 PM and has received 1120 views.

How to make the perfect social media sharing image - part 5 Essential Meta Tags


How to make the perfect social media sharing image - part 5 Essential Meta Tags

I have made several passes at improving the logic that Galaxie Blog uses to auto-generate the tags, and will share my experience with you. If you are using Galaxie Blog, the auto-generation of these tags is done for you.

Each social media site has its own rules for generating the meta tags. Facebook prefers open graph tags, Twitter can use the open graph tags, but it has a slew of its own proprietary tags, and Google +, LinkedIn, and Pinterest prefer schema markup tags, which I will not cover here.

Open Graph Tags

The following open graph tags are essential for Facebook

<meta property="og:image" content="URL to the social sharing image.">
<meta property="og:site_name" content="The site name (ie Galaxy Blog). " />
<meta property="og:url" content="The URL to the article" />
<meta property="og:title" content=" Must be 25 characters or less, especially for mobile" />
<meta property="og:description" content="Should be up to two sentences long, but under 30 characters for decent mobile rendering" />

The og:image:height and og:image:width tags are helpful, but not necessary. Facebook will correctly determine the proper image size as long as you stay within the Facebook recommendations.

Essential Twitter Tags

<meta name="twitter:card" content="summary_large_image">Use 'summary_large_image' if you're following along with this article
<meta name="twitter:site" content="@Site or article URL">
<meta name="twitter:title" content="The title of your site or article">
<meta name="twitter:description" content="Description, should be less than 200 characters">
<meta name="twitter:image" content="URL to the social sharing image.">
In the next article, I will go over some useful validation tools and share some tips and tricks with that I found.

This entry was posted on November 3, 2019 at 1:07 AM and has received 958 views.

How to make the perfect social media sharing image - part 4 Image Examples


After the last entry, I wanted to show you the social media images that were created by ColdFusion. Each of these images match the exact recommended size and the ratio aspect that are recommended by the various social media platforms. I'll show you the actual images that were created, and how the social media platform displayed the images after I shared the previous article.

The images

The first image to the left is the original image that was uploaded. This is a picture of my dog, Toby, a super-smart, 13 y.o. bundle of energy running in the snow. The second image, in the middle, is the Facebook social media image, and the image to the right is the Twitter social media image. All of the social media images are copies of the original.

Galaxie Blog will automatically take the image that you want to post, and create Facebook and Twitter social media images that are sized per the social media's recommendations. The Facebook social media image is 1200 pixels wide, and 630 in height. Twitter is similar, but just a hair shorter. They are 1200 pixels wide, and 628 pixels in height.

How the page renders on social media sites

Below are the social media sites render the page when it is shared. The images below are actual screen shot's of the last post I shared in part 3 of this series. Again, the image to the left is the original. The middle image is how Facebook presents the site, and the image to the right is how Twitter displays the share.

Both Facebook and Twitter will take the images that were created by Galaxie Blog, and resize them into their own format. As long as the images either meet the maximum or minimum dimensions as they do here, the site presentation of the share will look good.

Note: this approach works for Slack and LinkedIn sites, but this is outside of the narrow Facebook and Twitter scope that I wanted to blog about.

Next up in this series, how to properly use the meta tags for social media sharing.

This entry was posted on November 2, 2019 at 1:45 AM and has received 1216 views.




Footer Logo

Your input and contributions are welcomed!

If you have an idea, BlogCfc based code, or a theme that you have built using this site that you want to share, please contribute by making a post here or share it by contacting us! This community can only thrive if we continue to work together.

Images and Photography:

Gregory Alexander either owns the copyright, or has the rights to use, all images and photographs on the site. If an image is not part of the "Galaxie Blog" open sourced distribution package, and instead is part of a personal blog post or a comment, please contact us and the author of the post or comment to obtain permission if you would like to use a personal image or photograph found on this site.

Credits:

Portions of Galaxie Blog are powered on the server side by BlogCfc, an open source blog developed by Raymond Camden. Revitalizing BlogCfc was a part of my orginal inspiration that prompted me to design this site.

Version:

Galaxie Blog Version 3.0 RC (Toby's Edition) April 15th 2022 Blue Wave Dark theme