-
AuthorPosts
-
May 27, 2015 at 9:34 pm #283814
Hey! I’m incredibly grateful for Cornerstone, and can’t wait to get to know it better and watch it grow up!
Having said that, I’ve got an issue, and would love if you could point me to the solution or a workaround! My issue started when I needed to wrap a column in an a tag, making the entire column a clickable link. This is an example of where the Raw HTML shortcode and/or double-layering Content Bands were useful in VC.
Scroll past the slider on this page (http://76e.af2.myftpupload.com/home-vc/) and you’ll see that using VC I was able to wrap those columns in a tags. However, I can’t do that with Cornerstone currently, at least as far as I’ve been able to tell. I tried using the Text shortcode around the content in the column, but it didn’t work out. Since I wasn’t outputting any actual visible text, the shortcode disappeared from view in the Cornerstone Preview pane. When that happened, I tried adding it a couple more times, and it kept disappearing. I decided to investigate, so I went to the WordPress editor and looked in the Text tab. The shortcode was indeed there, but was invisible in Cornerstone. I tried deleting it, updating the page, then editing in Cornerstone, then saving, then switching back to the text tab in the WP editor page to see if the code was still there, and it was. (Side note: that means I now have code that I don’t need and can’t delete from Cornerstone. How do I fix that?! Lol.) I expected this because of the warning I kept getting when switching between Text edit and Cornerstone. I can understand that. However, I do believe there has to be SOME way for developers to peek under the hood and tweak things, so we could use Cornerstone for everything it offers, but hard code things when we need to. A start would be getting a Raw HTML shortcode element like we have in VC (which I think you guys added to VC – I don’t know).
It seems to me that introducing a Raw HTML shortcode to Cornerstone would help alleviate a lot of issues, by allowing us developers to code whatever Cornerstone’s missing. It’s a stopgap solution that will allow us to fill in Cornerstone’s holes. I don’t want to develop in VC anymore, but it’s hard to adopt Cornerstone immediately if I don’t have access to any form of the page’s actual code.
Let me reiterate how grateful I am for Themeco, X, and Cornerstone, and I’m sure you’re absolutely slammed with support tickets right now. I’m patient! Thanks for everything.
Do you know of a workaround I could use to make a column a link? Or am I missing something? Any help would be great!
May 27, 2015 at 9:53 pm #283838Just add a text element and insert the raw html. Just make sure it is set to the text and not visual.
May 27, 2015 at 10:18 pm #283874Thanks for the thoughts, @mobeus. However, when you only write HTML and don’t include actual text, the text element disappears in Cornerstone, which sure makes it difficult to manage!
Also, to answer one of my own questions I posted earlier, I simply highlighted the column and hit Erase in the Inspector. That removed all the elements from the column, including the old Text shortcodes that had disappeared.
May 27, 2015 at 10:50 pm #283911There is a “Code” Element in there. Right next to “Clear”, Below “Card” and above “Contact Form”
– Charlie
May 27, 2015 at 11:01 pm #283923Thanks @charliepryor! I thought that was it, but that actually is a code snippet shortcode, allowing you to display code to the viewer. It doesn’t let you write raw code and inject it into the page. 🙁
May 28, 2015 at 9:29 am #284502Hey Philip,
Thanks for writing in and for your thoughtful comments on Cornerstone! Regarding the wrapping of an entire column’s contents within an anchor tag, maybe I’m not understanding what it is you’re trying to accomplish, but you could definitely use the Text element for this. The Text element will receive raw HTML in the editor as well as shortcodes if you need them. Yes, if you start typing just an anchor tag without any markup, it will “disappear” for a second, but eventually as you write in more markup you’ll start to see what it is you’re working on. Even if you’re writing HTML that won’t have actual text, my assumption is you’ll ultimately put something in that will be styled to have a physical appearance (i.e. an image, a div with some height and width and a color, like your provided example). The intent of the Text element was that it could take the function of the multiple redundancies in VC and there wouldn’t be a need for a “Raw HTML” element (since you can use Text for that) or a “Raw JS” element (since you can use the Custom JS editor on the Settings pane).
If there’s a particular nuance to this that we’re missing at this time, if you could please give us some more in-depth analysis on things that’d be great. Cheers!
May 28, 2015 at 11:34 am #284702Thanks for the quick response! I can’t believe you guys aren’t in hybernation somewhere.
I agree with your basic premise – that the Text element should negate the need for a Raw HTML element. When it become stable, I can completely see how that will work great! I’ll outline the glitches I’ve found in a bit.
This page (http://76e.af2.myftpupload.com/) will give you an immediate idea of what I’m trying to do. Scroll past the slider, and you’ll see my four-column row. It functions exactly how I want it, except without the a tag. http://76e.af2.myftpupload.com/. I was able to create what I need in VC using double-layered Content Bands (though it was hacky), found here: http://76e.af2.myftpupload.com/home-vc/.
It may simply be that my particular need is an edge case, but it made sense in my mind! Here’s what I’m trying to do. I need a row with four columns. Each column has an image with a Custom Headline on top of it. The Custom Headline will have an opaque background color to give it some definition and assist in legibility. When mousing over the column, the whole thing will become 50% opaque, but the background color on the Custom Headline will actually darken a bit to ensure continued legibility. Now, I could easily do all this in Photoshop, but that seems old school, you know? Not to mention I like the text being actual text for search engines. Therefore, my solution was to add a background image to each column (had to do manually), add the Custom Headline, and wrap everything in an a tag. Because it’s pretty simple content inside the column, there aren’t too many issues with regards to thinking about how the a tag affects the styling. I can see how it’d obviously be a bad idea to wrap a super-involved column in an a tag, but that’s not the case here.
Using the Text element has not worked, after extensive attempts at various solutions. I was able to do everything except get the a tag around it all – the Text element kept stripping out the a tag! I’m used to the Visual tab doing that, but the Text tab never does that in the WordPress Editor, so I was very surprised by this behavior. If I can’t control the code, Cornerstone becomes an ineffective tool for developers, for the time being. This is the biggest problem I’ve found so far – being unable to control the code, which brings me back to the main point of this whole post: the Raw HTML element is probably the best stopgap solution for the time being, until Cornerstone matures to the point where we can do everything using the tools you’ve built.
I have found a few glitches that you may be interested to hear about! Lol.
- Okay, so first of all, I added a Text element. Inside the element I used the shortcode generator to create a Custom Headline. First glitch is that though the Text element was displaying in the Preview pane as a box with diagonal lines in it and a T superimposed over it, the Custom Headline wouldn’t show up. I switched to the Visual tab in the Text Inspector, and it still wouldn’t show. It wasn’t until I switched to the Visual tab and then back to the Text tab that it displayed, or if I switched to Visual and then clicked on the Text element in the Preview pane. If I clicked on the Text element in the Preview pane before switching over to the Visual tab, the Custom Headline shortcode would disappear from the Text tab area, so any work I would have created would be lost. If I forgot to click on the Visual tab and then either click on the Text tab in the Editor pane or click on the Text element in the Preview pane, and then clicked away from the Text element in any way, it would disappear (though the code was still sitting there when I checked in the WordPress editor Text tab for the entire page – meaning to say I left Cornerstone to verify the code was sitting there). I spent a lot of time figuring this glitch out precisely, and tried to document it thoroughly so you could easily replicate the issue on your end. 🙂
- Okay, assuming I got the whole Text element set up properly so I can see the output in the Preview pane, glitch number two presented itself. When I click on the Text element in the Preview pane, it pulls up a Custom Headline Inspector, rather than the Text Inspector. When mousing over the element in the Preview pane, I still see the blue tab saying ‘Text’ above the element, but clicking anywhere in said element takes me to the Custom Headline Inspector, so I’m effectively locked out of making further edits to the Text element (side note: you can edit the code in your browser inspector and add an after the Custom Headline, which will give you a place to click in the Preview to bring the Text Inspector back). Now, if I had added other elements before clicking out of the Text Inspector, like a button or a line divider, I’d be able to get back into the Text Inspector. I had assumed this was because there was empty space to click in the Preview pane, but even when I clicked right on top of the Button it didn’t take me to a Button Inspector, but rather took me to the Text Inspector, so it seems like Custom Headlines may be a unique case.
- Side glitch: I’ve found that once you use the Map Embed, if you choose ‘No Container’ and then leave the Map Embed Inspector, there’s no way to get back to the Map Embed Inspector by clicking the map in the Preview pane (short of again going into the browser inspector and adding a space after the map, which you can then click to bring back the Map Embed). When I place the Google Maps embed code in the Map Embed Inspector, the map seems higher on the z-index than the Preview pane’s clickable elements. This is not the case with the Google Map element – it works fine, though you of course lose all the additional features that come with using actual embed code, like easily getting directions to the location from within the map.
Sorry for the length. I know you guys are putting out a billion fires right now. :/ You guys are amazing at what you do!
May 28, 2015 at 11:36 am #284705I just realized I literally worked on that response for two hours. Enjoy!
May 28, 2015 at 8:06 pm #285243Hi there,
Thanks for your dedicated time, really appreciate it 🙂 , added that as feature request.
And I also noted the bugs as I confirmed some of it. We will work on it, but I can’t promise an instant solution 🙂
Thanks again!
May 29, 2015 at 6:36 pm #286293I had a similar need for a raw-code element in Cornerstone. For now, I’ve decided to put the php functionality itself into my own shortcode, and simply use that in the Text element. It’s not as simple as I’d hoped, but it does work as a solution. Perhaps you could try that?
May 30, 2015 at 3:40 pm #286970Hi there,
Glad you’ve sorted it out and thanks for sharing a nice idea with us.
Cheers!
June 1, 2015 at 12:40 pm #288824@stephenjlizard, thanks for the thought! That probably would have worked perfectly for me! Fortunately, however, with Cornerstone 1.0.1, they released the Raw Content element!!!!!!!! How great!
Staff, that was a much faster fix than I was even hoping for! Thank you so much! That improves the Cornerstone functionality to 100%, really. I now have zero hesitations migrating as many sites from VC to Cornerstone as possible!
Also glad to see that map embeds are now clickable!
June 1, 2015 at 11:56 pm #289398You’re welcome, Philip. Glad we could help.
July 29, 2015 at 1:09 pm #344417Just wandering how you managed to do this too? I want 4 columns and want them to animate and be click able but can’t for the world of me find out how to do it. Thanks
TomJuly 29, 2015 at 4:50 pm #344582Hi There,
At this time we kindly ask that you open an separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.
Thanks!
-
AuthorPosts