Pasting Text from Word into HireCentric Job Description Area

Article Appropriate for These User Types: ADMINISTRATOR, POSTING MANAGER
Applicable HireCentric Dashboard: JOBS


Ever wonder why you are finding crazy characters in your job board postings, specifically CareerBuilder? It’s because Microsoft Office “language” and internet “language” are not the same. There are hidden background characters that do not properly transfer from one to the other. If you have any previous experience with pasting text from Word into a web-based rich text editor (maybe for your website, blog or email marketing platform), then you probably already know there are certain essential tricks to doing this effectively and getting your content to look normal on a web page. These same techniques come in handy when pasting your job descriptions from Word (or even a .pdf) into HireCentric's WYSIWYG editor (stands for "What You See is What You Get") on the job template and job listing pages. Or, if this is type of process is new to you, please take care to follow the guidelines outlined in the video and/or corresponding tip sheet, below.



The problem with pasting content from Word to a WYSIWYG editor is that Word's invisible Microsoft XML formatting is brought over with the copy/paste (NOTE: this problem is not isolated to HireCentric; in fact, this is the case for all Word to web-based portal copy/paste operations). Then, this hidden styling overrides HireCentric's web styling and causes the content to take on the properties of the original Word document rather than your web page - and that almost always means that it will look funky on your careers portal and on external job boards. Plus, this imported styling will behave differently in different browsers in many cases. Sadly, what you see will NOT be what you get. So, how do you fix it? The key is to strip out the styling BEFORE the text is pasted into HireCentric's WYSIWYG editor.

We'll review a few options, below. All require a bit more effort than just pasting directly from Word...but we promise that it will be less work for you in the long run, and your job descriptions will appear more pleasing to your applicants' eyes.

Option #1: Type content directly into HireCentric
Option #2: Use the "Copy to Paste a Word Document" button
Option #3: Copy and paste content into Notepad or another plain text editor - PREFERRED option (if you have to paste)

Option #1
Type your job description content directly into HireCentric on the Job Template tab in the Jobs Dashboard.
This is an ideal situation if you are posting a brand new type of position for your organization; however, it is not necessarily your most favored approach if you have a bunch of existing job descriptions available to copy from Word files. The upside of this approach is that there's absolutely no way that hidden code will affect the appearance of your job postings. You simply type away and then use the WYSIWYG editor to add your desired formatting. While this may take the most work of all these three options, considering that your job templates can then be used to create multiple job listings in a cinch down the road...it may make sense to go this route.

Option #2
Copy content from Word and then paste it into HireCentric using the "Copy to Paste a Word Document" button above the WYSIWYG editor.
While this approach isn't always as effective as #3 to be explained below, it can help you out when you are in a hurry. Here's how:

Start with your original Word document like the example below. Note that this job description has line breaks between paragraphs and headers, and it also uses bullet points:
In order to remove the formatting from Word before copying and pasting into Notepad, first highlight all the text in your Word document. Then, find the "Clear Formatting" option in your version of Microsoft Word. This can be tricky to locate depending your version of Word. In the example below, Word for Mac 2011 is being used and the option is only visible if the "Styles" Toolbox is made visible from within the View menu. If you’re not familiar with this feature, you can do a quick search within Word to find out more. In some of the newer versions of Word, it appears as an eraser.
Click the "Clear Formatting" option and now note the appearance of the highlighted text within Word.
Copy the unformatted text in Word, and then go to your HireCentric portal. Then, on either your Job Template or Job Listing tab (depending on whether this is a brand new type of position for a newer version of an older position), select the magnifying glass next to the appropriate existing title (or create a new one with the green plus button). Then, click the "Click to Paste a Word Document" button just above the WYSIWYG editor.
Once you click it, the button will expand to be a text box. Copy your newly unformatted text from Word and paste it into the box below. Click "Import."
Then, your text will be pasted into the HireCentric WYSIWYG editor.
For those of you interested in what the HTML coding looks like for the above pasted text, click the little "HTML" button your WYSIWYG editor to bring up that window:
As you can see, it is pretty plain except for the HTML tags for the existing line breaks brought over from Word. For example, the <p> characters denote the start and end (</p>) of paragraphs, and the <br/> characters stand for line breaks. Once you are done examining this HTML Source Editor window, you may hit Cancel.

Next, you may add back any bolding or bullet point formatting you desire for your listing using the buttons on the WYSIWYG editor. NOTE: It should not be necessary to change the font style or size on the editor as the CSS (Cascading Style Sheet) for your HireCentric portal will already dictate the sizing and font style for your job listings. If you would ever like to make changes to the font type/size used for text on your Careers portal, please contact support@exacthire.com and we can adjust that on our end. If you do still decide to change the font/size in the editor, then it may cause issues in your HTML code with extra irrelevant characters because you are in a sense trying to override the portal's CSS (the same problem described earlier with Word's hidden formatting overriding HireCentric's portal).

Here's how it looks once we've added some formatting (bolded headers, bullet points, and an extra line break just before "Duties" and "Skills/Qualifications"):
And, here's how the new HTML source code looks, too (in case you are interested):
Note the additional types of tags for items like bullet points, indentation, and bolding. Items in yellow are tags that have resulted from line breaks brought in when pasting; as well as, the bolding and bullet points that we applied. But, the pink/green tags are most likely the result of the extra line breaks we added...while they appear normal on the job portal, they can sometimes cause problems on external boards. If you find you have problems with the way your job appears on external boards, simply delete those extra pink and green tags from the HTML view and hit "Update."
 
Lastly, here's how it appears on the career portal's Jobs page:
Paste your job description into the Notepad program (or another plain text editor - like TextEdit on Mac) on your computer, strip out extra formatting, and then paste into HireCentric. This last option is probably the most effective at removing residual formatting resulting from a paste from Word. While Option #2 is effective in many browsers and will make your job look appealing on your careers portal, there may still be some extra tags in your code that will cause the job to appear differently when displayed on external job boards. Here's how to execute this option:

Follow the same steps as in Option #2 to clear the formatting out of your Word document, but then, before you paste it into HireCentric, open up the Notepad program (or other plain text editor on your computer) and paste the text into a blank Notepad screen.
Then, reselect the text in Notepad and copy and paste it straight into the description window in HireCentric (you can bypass the Copy from Word button with this approach. Then, add the formatting. The end result will appear the same, but the code may be a little bit cleaner which will help your efforts when posting to external job boards. For example, with this approach, here is the HTML code view:
Note that this code has a little less HTML tag clutter than with the second option...no green highlighting. You may optionally still wish to delete these extra pink tags, however.

If this is new to you, don't worry...you will get better with practice and by following the guidelines outlined above. As always, please feel free to reach out to Client Services at support@exacthire.com if you need any assistance.

YOU MIGHT ALSO LIKE:
How to Make Indented Sub-Bullets on Job Listings


 

Print Friendly and PDF

Did you find this article helpful?