• 0

DMS 2 How to insert markup before or after a Canvas area


Question

Posted · Report post

Is there any way to insert arbitrary markup before or after a canvas area? I really need a hook or a filter or something... some way of accomplishing this. I'd really like to accomplish this with PHP, rather than javascript. Though I don't think I'm quite savvy enough to tear through the section caching code to figure it out. 

 

One of my goals is to insert fancy dividers between bands of content. It would also allow the insertion of buttons

 

Any help would be greatly appreciated. Thank you.

 

 

Share this post


Link to post
Share on other sites

5 answers to this question

  • 0

Posted · Report post

Hi,

 

If you want to include borders, why not just use CSS ?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

If I could use pure CSS I would. Unfortunately, what I am need to achieve is a bit more complex that what can be achieved with the two pseudo element limitation, and cannot be accomplished with CSS.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I would need to see an example of what is it you're trying to achieve, can you provide a concept image please.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Sure. Here's a Codepen I created to test out different separator / divider styles. A couple of the styles use SVG images that are placed between the .pl-area sections. Having them parallel to the section allows the use of CSS sibling selectors to easily change the positioning and color as necessary in very dynamic ways.

 

This is one example of the kinds of things I would like to be able to do.

 

There are two ways I can see this functioning:

 

1) A filter or action hook that returns info about the section, so you can programmatically choose which section to hook into based on it's ID. This might be useful in some circumstances. Though I don't know enough how about how section IDs work to know if that's a solid option. Using IDs seems very limiting.

 

2) A class based approach. The most useful and efficient method I can think of is the addition of an action hook or filter that allows you to target canvas areas based on what theme they have selected. Since version 2.0.5, with the inclusion of the pl_theme_classes filter, you can arbitrarily set themes in the dropdown that is assigned to a canvas area. If you could intercept calls to sections that use a specific class, you could target canvas areas as groups, to easily make rapid changes throughout the entire site, instead of having to go through every single page that uses that style of canvas/section.

 

I'm currently working on a styling system that sits on top of DMS for internal use within my company. For our sites, we need the ability to rapidly style a site globally, rather than on a page by page basic. 

 

Any help or insight you could offer into how to tap into the markup output of a section based on which theme it has selected would be greatly appreciated. Heck, maybe this functionality already exists, and I'm just not wise enough to figure it out. Perhaps this is impossible, and my request is ridiculous. You tell me :)

 

Either way, thanks for your time.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I will need to test this myself, I still can't see why this can't be done via CSS. However, see as you already have the code you wrote via CodePen, why not just create your own sections ?

In doing so, you can therefore, just drag and drop them for quicker styling, rather than having to use CSS for different sections if that makes sense.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now