steelbridge.io

Website Design, Development & Engineering

ParsonsHosting

I love the work of managing a server. Of building the pathways to information. There is something about the obscurity of database and server-level development that compliments my already obscure personality and lifestyle. Eclectic? Yes.. but we all have layers that make up the wonderfully complicated people we are. But I digress.

Parsons Hosting offers a refined hosting environment. It’s fast, intuitive. Comes with great support and all the insight you need to create your best website from a blog to e-commerce.


Sign Up Here

I have room for 500 people. Let’s do this!

Parsons Hosting
Log-In Screen where you access your website dashboard.

ParsonsHosting is brand new. The brain-child of PH started about a year ago as I became aware that people simply want to do web development themselves. And the tools are available to do just that. I envisioned simply offering all those tools with support, which I love to provide, for an annual fee (or monthly, quarterly). 

I love to help people, but when I’m working on a project, like building a website or an application, I can’t really be there for all but the project. So ParsonsHosting or PH, allows me the opportunity, with some external momentum, to develop the company culture I dream of being a part of.

What happens is my clients, customers are my advertising. Google doesn’t advertise that they are a great search engine. They just perform. I like how Google releases a feature or solution and it’s word of mouth that spreads the value. Google is like “Here you go. This is for you. It will work awesome.”

Google is like “Here you go. This is for you. It will work awesome.”

ParsonsHosting

I hope you consider working with me, soon to become us. PH has my name on it because I just couldn’t come up with anything else. It’s plain and sounds neutral. But as we grow, the culture and service we provide will be creative, fresh, and innovative. Why? Because I love the web. I love technology. I love to see people’s lives improve because I helped in some way using my gift and that’s interfacing with technology.

In a way, PH is my effort to do what I want. Selfish in a way. I want to fix problems in the online world. For you. I want to be involved in that process and I need infrastructure to allow me to go about my day, making yours better in some way, and learning as I go. Once I can’t do that anymore then I will move on to the next venue.

“Hope we get to meet in front of a dashboard.”

 

Chris Parsons  >  Web Developer  >  Owner  >  Father  >  ParsonsHosting

 

Bootstrap 4 Carousel With Fade Effect

Here’s a Bootstrap 4 Carousel with fade transition instead of a slide transition. I find carousels or sliders annoying due to the sudden and hurried transitions from slide/item to slide/item. Example shows the code for three items or slides. Excuse my echo() functions as this example is used in a WordPress theme where the Carousel renders on the front page or home page only. Edit to your specifications.

I have also included the additional CSS required to produce the fade transition effect. Also, my example includes Bootstrap captions. I do not care for captions on-top of carousel images, however, it’s demanded. So, in order to allow the text to be readable or not saturated by the background , I applied a background-color #000 to the container ID and opacity: 1; to .carousel img

It’s assumed bootstrap.css and bootstrap.jsis found in your assets directory. If not, add it of course and if you are using WordPress, add the required Bootstrap dependencies described above into your WordPress theme. How to do that is another topic. I’ll try to write about it.

Below is the HTML

<!-- Carousel -->
<div id="carouselBeadManRedding" class="carousel carousel-fade">
<ol class="carousel-indicators">
<li class="active"> </li>
<li> </li>
<li> </li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active"><img class="d-block w-100" src="/add/your/image.jpg" alt="Add Alt">
<div class="carousel-caption d-md-block">
<h2>Title</h2>
<p class="lead">Lead Text</p>
</div>
</div>
<div class="carousel-item"><img class="d-block w-100" src="/add/your/image.jpg" alt="Alt text">
<div class="carousel-caption d-md-block">
<h2>Title</h2>
<p class="lead">Lead Text</p>
</div>
</div>
<div class="carousel-item"><img class="d-block w-100" src="/add/your/image.jpg" alt="Alt Text">
<div class="carousel-caption d-md-block">
<h2>Title</h2>
<p class="lead">Lead Text</p>
</div>
</div>
</div>
</div>

Below is the custom CSS

/* Carousel
----------------------------------- */

#carouselBeadManRedding {
     background-color: #000;
}
.carousel.carousel-fade .carousel-item {
    display: block;
    opacity: 0;
    transition: opacity ease-out 1.7s;
    left: 0;
    top: 0;
    position: absolute;
}
.carousel.carousel-fade .carousel-item.active {
    opacity: 1 !important;
}
.carousel.carousel-fade .carousel-item:first-child {
    top: auto;
    position: relative;
    transition: opacity ease-out 1.7s;
}
.carousel.carousel-fade .carousel-item:second-child {
    top: auto;
    position: relative;
    transition: opacity ease-out 1.7s;
}
.carousel-item .img-fluid {
    margin: 0 auto;
}
.carousel img {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

I found this post on codeply to be very useful in helping me resolve some of the trouble I was having with transition CSS. Here’s a link Codeply Bootstrap 4 Carousel Fade Transition.

Josephine Moore

I didn’t build this theme, but I love its presentation. I was hired to solve some content delivery issues on this site in addition to addressing logo sizing on all devices as well as site speed.

 

See It Here Live

Josephine Moore

Essential Theme

A static theme that can be converted into a WordPress Theme. I created Essential using the BootStrap Frame Work. This theme will work great for any business selling product online or providing a service, like a hair salon.

 

See the Demo site here

 

 

Essential Theme

 

WordPress: Hacked

With over 25% of total websites online today being driven by WordPress, it’s no wonder this popular blogging platform that became a content management system and now an application with its own API has been the focus of “Hacking”. This article describes how to avoid a WordPress Hacked scenario.

What is a hacked WordPress site? Here are some examples:

Defaced/ Hackers replace your websites content with their own. In most instances, all your website content is erased and/or replaced with the hackers malicious content or web page. The image below is a screenshot of a website that is obviously rendered unrecognizable and impossible to navigate because the hackers code is “all wrong”.

hacked site example

Example of a site hacked and defaced. Photo found at https://www.hackread.com

Malicious Redirect/ Essentially this method redirects traffic from the hacked website to the hackers malicious website. A good way to do this without being detected immediately is to redirect traffic to a specific page. In my early days with WordPress, my fly fishing website bethefly was infected with a phishing page (almost a pun) where the hackers created a page asking for financial information posing as a certain German Bank. The page wasn’t directly accessible through site navigation means. The hackers simply pointed a URL to my sites IP address and the page in question. I was made aware of this issue when German authorities contacted me.

SEO Spam/ This method is accomplished most commonly by a hacker inserting a web-page in your website directory. If you have a site that is performing well, a hacker may infiltrate your hosting environment and create a page used to benefit from your hard earned search prominence. SEO spam can go undetected until a site audit is performed.

Malware/ This is a big issue online today for websites running WordPress. The installation of plugins found in the WordPress repository exposes a WordPress site to malicious software that can install malware on your site and visitors computers without your or any visitors knowledge.  This is not to say all plugins are “bad”. No way. You can see ratings and updates to the plugin of interest and easily, confidently make a sound judgment call on whether to install “any” plugin. Where most end up in trouble is when the plugin sits on your website, going without updates, check-ups on credibility, maybe it has not been tested with the current version of WordPress. Sadly, overtime hackers figure out how to exploit a given plugin or WordPress core itself, and then it’s game over.

Ransomware/ This is an insidious attack where the hackers literally hold your website hostage in exchange for payment. Often, the website files are encrypted. In order to restore your site, payment is required in order to obtain a decryption tool. If this happens to your site, find an expert at helping you restore your site and pay them.

Ransom Example

A ransom page asking for Bitcoin as payment in order to access decryption software.

The list is much longer than I care to write about in this post of how your WordPress website can be exploited, how visitors to your site can be exploited.

How To Protect Yourself From a WordPress Hacked Scenario

Keep Backups! Lots Of Them!

The key here is to research every plugin you put on your site. Pay attention to the plugin ratings associated with its presence in the WordPress plugin repository. Keep those plugins up-to-date. Keep WordPress up-to-date. Keep a number of recent back-ups handy. Back-ups can be kept on your server, but a copy of a number of back-ups should be kept in an external location, like DropBox, Google Drive or your local storage. I keep a number of backups handy that date back 6 months. I run automatic backups with UpDraft about once a week or whenever I update my website or your website. Always keep an external copy as described so in the event your sites root directory gets hit, you have a reliable, clean back-up that literally saves you thousands of $$$.

Use A Security Plugin

I use WordFence on all the websites I create. I will also move the config.php file out of root in addition to the wp-content folder. How to do that in addition to a few other options I’ll describe below will protect your self-hosted WordPress site and minimize the chance you’ll get hacked.

One of the first tasks I accomplish in hardening a WordPress installation id hiding the version as I describe below:

Hide WordPress Version

Add the code below to your config.php file found in your WordPress file directory:

Remove_action('wp_head', 'wp_generator');

Never Use Admin User Name

Always delete this initial user. You can do this by simply creating a new user assigning an Administrator role to the new user (i.e. create a new username, password). Next, log-in as the new user and delete the Admin user from within the Dashboard -> Users.

Limit Login Attempts

WordFence is a great security plugin that offers this feature. Need help configuring this plugin? Contact me.

Block Access To config.php

I prefer, as most do, to run WordPress on a server running Apache. Most WordPress installations running on Apache will have a file named .htaccess in the WordPress directory. Using your ftp client, find this file and make a copy of it! Next, download and edit .htaccess by adding this code at the bottom of the existing code:

&lt;FilesMatch ^wp-config.php$&gt;deny from all&lt;/FilesMatch&gt;

 

.htacess - WordPress Hacked

Here’s an example of what you should see in your .htaccess file with the code that blocks access to config.php at the placed at the end/last line

 

Save .htaccess and upload. Test your site. If you get a 500 error or blank-white screen, rename the file you just uploaded as .htaccess-nfg and restore the copied version to .htaccess (You should be able to accomplish this within the remote or live view of your ftp client. If in doubt, contact me here or use my Zendesk option below-right labeled “Help”. I typically respond within minutes if I’m not sleeping.

An alternative method is to simply move the config.php file out of the WordPress directory. But this only works if you have your WordPress install in a sub-directory (I install WordPress in its own sub-directory 100% of the time). Simply move config.php into your hosting environment root directory, or up one folder from your existing WordPress directory. Don’t worry… WordPress knows to check out the parent directory if it can’t find config.php in its own directory.

Move wp-content Up One Directory

Again, this is a great option for WordPress installs residing in a sub-folder/sub-directory. This option isn’t available for versions of WordPress 2.6 or < . As of today, the current version of WordPress is 4.8.3. How to check your version of WordPress? Scroll down and look bottom right of your dashboard screen.

Anyway, if you do move your wp-content file into a parent directory you will need to add the following to your config.php file just before the end of the file but before where it says 

/* That's all, stop editing! Happy blogging. */
/**
*Tells WP where to look for wp-content
*/
define('WP_CONTENT_DIR',
$_SERVER['DOCUMENT_ROOT'].'/your-wp-folder-name/wp-content');
define('WP_CONTENT_URL',
'http://your-site-domain.com/your-wp-folder/wp-content');

Sometimes, plugins will not work dealing with this non-standard directory structure. As a precaution, add the following below the code you just entered:

/**
* Tells WP where to find plugins
*/
define('WP_PLUGIN_DIR',
$_SERVER['DOCUMENT_ROOT']. '/your-wp-folder-name/wp-content/plugins');
define( 'WP_PLUGIN_URL',
'http://your-site-domain.com/your-wp-folder-name/wp-content/plugins');

(Make sure to update code with your URL and WordPress folder name where indicated)

Add Salt To Your WordPress config.php

Yep, add salt. Go here: https://api.wordpress.org/secret-key/1.1/salt/

Copy the code. All of it. (you know highlight and press CMD+C or Ctrl+C if you’re on PC).

Go to your config.php file and look for a section called “Authentication Unique Keys and Salts”.

Highlight and replace (CMD+V or CtrL+V on PC) or delete the existing salts and replace with the Salts you copied a second ago. The section I’m referring to looks like this: (the code in question is every line that begins with the “define” statement.

 

WordPress Salts - WordPress Hacked

An example of the Salts found in config.php

Get An SSL Certificate

Not only is this a great way to show your site is trusted, it’s becoming a mandatory security practice. See this article. Get one and avoid having your site labeled as “insecure” by Chrome and no doubt browsers to come. You can get SSL certificates through your hosting provider. Need hosting? I offer it through GoDaddy here. Includes free SSL.
Once you have an SSL activated, enter the following code in your config.php file:

define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);

This will force visitors and administrators to log-in to your site via a Secure-Socket-Layer encrypted page. That’s secure! Word to the wise: Do not set up your SSL as a self-signed certificate. Your hosting provider will help you with this.

Why Use WordPress If It Get’s Hacked?

With the web comprised of an ever-growing number of self-hosted versions of WordPress, the option to target the platform is obvious. But, consider this: Should you build a website on another platform? Does that mean your site won’t get hacked? No. Any site can be hacked. If your website is popular, it’s a matter of time before it’s hit with an attack. Understand that WordPress gets a bad wrap because it is popular. It is a proven and effective way to deliver web content. When we consider the 1/4 and growing share of website volume worldwide running WordPress, of course, there’s going to be WordPress sites being hacked. WordPress isn’t responsible for “Hacking” as much as hackers will target websites.

So, I guess one could argue that if they choose to use a CMS like Craft, or Joomla, Drupal, Jeckly and a host of others they will fly under the radar of the hackers and malicious bots that crawl the web. That’s like saying “There’s lightning and I went outside and didn’t get struck” okay. But if a million of you go outside, and you’re all holding lightning rods, and an exceptionally large percentage of you happen to be wearing red jackets… is it fair to say that most people struck by lightning were wearing red jackets, so don’t wear red jackets? I don’t doubt there are hackers that target WordPress. But if it isn’t WordPress, it will be some other dominant content management/delivery system that becomes a target.

In the “wild west” of the web, I would choose a platform that is widely supported. If one chooses to be different, I understand but be prepared to die by your own sword.

Should my site get hacked, I will need the help of others in the open source community to bail me out. This is one of the main reasons why I choose WordPress as my tool of choice when building dynamic websites. WordPress has an immense support culture providing answers and solutions. Should I have to contend with a hacked WordPress site, I can consult with many techs who have already experienced my dilemma and already have a solution.

Another reason why I choose WordPress is the community of developers contributing to its core are creating a better, more secure version of WordPress monthly, yearly. I know of no other framework where the knowledge of how to avoid an attack, a hacked site is spelled out so clearly: Keep Your Site Updated & Current.

Software that is up-to-date is unlikely to be exploited. WordPress is aggressive about updates thanks to the passionate community supporting the platform. All of the hacked websites that have come across my desk where running old versions of plugins and/or WordPress. There’s a reason why the software is updated and it isn’t always for feature reasons!

If I was running another framework and I was compromised, I’d be more worried for sure. In my experience with hacked WordPress sites, I can say that 100% of the time, I was able to recover the site and clean it of the malicious content. If not, we use a backup to rebuild and restore the site and database.

I’m always interested in your thoughts and experiences. Let me know what happens! Okay?