locomotivecms / engine

A platform to create, publish and edit sites
http://www.locomotivecms.com
Other
2.32k stars 625 forks source link

Editable elements inside html tags bugging on live edit view #1116

Closed nielsenramon closed 8 years ago

nielsenramon commented 8 years ago

So when i for example have a hyperlink which needs the same editable text like the content of the hyperlink I do the following:

{% capture text %}
   {% editable_text "text", line_break: false, format: 'raw', rows: 1 %}
      Text
   {% endeditable_text %}
{% endcapture %}

<a href="{% path_to page %}" title="{{ text }}">
   {{ text }}
</a>

This will not render properly in the live editing view because it adds a <span> around the editable text inside the title property which is not possible breaking the html and styling.

Is there currently any way around this? Maybe something like a strip html to the capture element?

did commented 8 years ago

@nielsenramon there is a work-around

{% capture text %}
   {% editable_text "text", line_break: false, format: 'raw', rows: 1 %}
      Text
   {% endeditable_text %}
{% endcapture %}

<a href="{% path_to page %}" title="{{ page.editable_elements.<your block path>.text }}">
   {{ text }}
</a>
Pronex commented 8 years ago

I'm having a very similar problem with my images. They get added and work properly until I open the life edit view for the first time. Then the links break as 'https:/assets.locomotive.works/' is added in the middle of the image url.

{% capture coin_topright_url %}{% editable_file "coin_topright_image", hint: "Upload a coin image for the top right coin." %}coins/student.png{% endeditable_file %}{% endcapture %}

<a href="#tab-student">
     <span class="coin-image">
         <img src="{{ coin_topright_url | theme_image_url }}" height="160" width="161" alt="" />
     </span>
</a>

And I've tried a lot of combinations, also with the page.editable_elements.<your block path>.coin_topright_url work-around...

(cf. StackOverflow-Post )