How to put a visual editor in the listing form
I know this is far from perfect but it is such an simple mod and makes such a huge difference to the appeal of Vantage to business owners, IMHO. It doesn't replace the business description text area with a visual editor, it just places a wordpress visual editor above that field. What listing owners will have to do is put their content in the visual editor, then click the HTML tab and copy and past the code into the business description text area. This is why it isn't perfect, but it's a hell of a lot better than nothing.
If somebody who knows about PHP could improve this mod so that the text area is replaced with the visual editor, please let us know. Also, if any Appthemes developers read this please consider including this in the next release. I did it in about 20 minutes once I had done all the research, and I know literally next to nothing about PHP. All I did was copy and paste a bit from the Wordpress codex, then added some of my own HTML and CSS, so I'm sure it wouldn't take long to implement properly.
Anyway, here it is;
In the form-listing.php insert this code.
Code:
<div class="editor-directions">
<p>Create your content as you would like it to appear in your listing in the editor below. When you are done just click the HTML tab in the top right hand corner and copy the code into your business description. Be sure to explore all the options to get your listing looking just the way you want it.</p>
</div> (Put whatever directions you want here. I also made a note of the "Kitchen Sink" pointing out that there are more option available there, as it is hidden by default)
<?php wp_editor( PutYourContentHere, listingeditor ); ?> ("PutYourContentHere" can be anything and shows up in the editor initially. Make sure you don't have any spaces or anything if you want to change this. "listingeditor" is the editor_id and can only use lower case letters, nothing else. Both of these are required for it to work)
You put this code in between the images and business description like this; (I think it is about line 115)
Code:
<fieldset id="misc-fields">
<div class="featured-head"><h3><?php _e( 'Additional info', APP_TD ); ?></h3></div>
<div class="form-field images">
<?php _e( 'Listing Images', APP_TD ); ?>
<?php the_listing_image_editor( $listing->ID ); ?>
</div>
<div class="editor-directions">
<p>Create your content as you would like it to appear in your listing in the editor below. When you are done just click the HTML tab in the top right hand corner and copy the code into your business description. Be sure to explore all the options to get your listing looking just the way you want it.</p>
</div>
<?php wp_editor( PutYourContentHere, listingeditor ); ?>
<div class="form-field"><label>
<?php _e( 'Business Description', APP_TD ); ?>
<textarea name="post_content"><?php echo esc_textarea( $listing->post_content ); ?></textarea>
</label></div>
Next, you will want to add a few lines to you style sheet. The first bit puts a divider line between the images and the editor. It just makes the layout a little clearer.
Code:
/* =========== [ LISTING FORM ] =========== */
.editor-directions {
border-top: 2px solid #EBEBEB;
}
The way Vantage is now, lists don't display properly in the listings. The list icons in the editor are pretty useless then, so you need to add a few more lines to your style sheet. I don't know if this was deliberate or just something the developers overlooked as the business description is normally just a plain text field. Anyway, if you add this to you style sheet it will display lists properly.
Code:
#listing-tabs ul {
margin:10px 40px;
}
#listing-tabs ul li {
list-style-type:disc;
}
#listing-tabs ol {
margin:10px 40px;
}
#listing-tabs ol li{
list-style-type: decimal;
}
If you wanted to, I'm sure you could have a different list-style-type for the different levels of lists. I'll probably explore that later.
That should just about do it. I really recommend giving this a try, and let me know if there are any problems.
It goes without saying, of course, that you should do this in a child theme, not vantage itself. Just import the form-listing.php into your child theme directory.