Shortcode Conflict with Theme

[[email protected]]

I have enjoyed your theme very much, but ran into one issue.  I have a flipwall shortcode installed that works on other sites I’ve built, but for some reason it’s not working with the FlexForm Theme.  Specifically, I believe it’s not working with the “Swift Page Builder”.

I was able to get this to work here: http://www.gringham.com/test-flip
But not here: http://www.barneyadvisorytest.com/flip-test
I’ve reviewed this with multiple programmers and haven’t been able to get this.  The shortcode developer also had me add the js to the page in hopes that it would load properly, but didn’t work either.
Is there a way to bypass the Swift Page Builder, or to get around this issue?  This is an important piece of the site, and I can’t find anyway around it at this point.  Your help is greatly appreciated.
Shortcode documentation here: http://wordpress.org/extend/plugins/sponsor-flipwall-shortcode/

[Cosmin – SUPPORT]

Have you tried switching to classic editor and inserting the shortcode there? I don’t think it will work if you insert it in a Page Builder element.

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[[email protected]]

This reply has been marked as private.

[Cosmin – SUPPORT]

If you’re using the Classic Editor and don’t have anything from Page Builder in there, it should work. Checked your site and I saw it doesn’t have what to flip, there’s only one “item”.

Also, remove that & nbsp ; from there, it’s adding an unnecessary paragraph to your content.

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[[email protected]]

Thanks Cosmin – I appreciate your help.

I did remove the &nbsp.

I’m not sure what else you’re referencing.  I do not have anything from the page builder.  I have this installed identically (plugin and code) on two sites…one works and one does not:

http://www.gringham.com/test-flip/      — this works
http://www.barneyadvisorytest.com/flip-test/      — this does not.

When I switch back to the 2012 theme on the barneyadvisory test.com it works fine, but when I switch to the flexform theme then it won’t work.

Any thoughts?

[Cosmin – SUPPORT]

Checked again, I see something is breaking the theme, nothing from footer.php is being output. Since I can’t see what’s there, are you using any other plugins?

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[[email protected]]

Thanks Cosmin.  Current active plugins are:

Gravity Forms
iFrame
Revolution Slider (came with theme)
User Photo
Wordpress Importer

Also – the domain changed – so to test you are not going to http://www.barneyadvisory.com/flip-test

[Cosmin – SUPPORT]

Besides the slider plugin, can you disable them one by one, testing each time to see if the issue goes away?

Regards,

————————————————————————————————————

Cosmin
Support Assistant

[[email protected]]

Thanks Colin – I deactivated the plugins one by one and did not solve the problem.  They are reactivated now.

Please keep in mind that if I go back to the 2011 or 2012 theme then the problem is resolved, which is why I believe it is a theme conflict, specifically with the SwiftPageBuilder.

Is there a way that I can create a custom page type and strip out the code for the swift page builder or any other theme options that I’m not using and just use it for this page?  What would I need to strip out?

[Cosmin – SUPPORT]

Hi,

Unfortunately the page builder can’t be stripped out – it’s part of the theme framework.

I’ll assign this to Ed, maybe he has a suggestion that I’m missing.

Regards,
————————————————————————————————————

Cosmin
Support Assistant

[Swift Ideas – Ed]

Hi there,

Just taken a look, and it doesn’t look like the css file is loading for the plugin. Try adding this to Flexform Options > General Options > Custom CSS:

.flipwallListHolder:after{
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
	}

div.flipwall-tile{

	width:180px;
	height:180px;
	float:left;
	margin:4px;
	
	/* Giving the sponsor div a relative positioning: */
	position:relative;
	cursor:pointer;
}

div.flipwall-tile div.flip {
	/*  The sponsor div will be positioned absolutely with respect
		to its parent .sponsor div and fill it in entirely */

	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	border:1px solid #ddd;	
	background:url("img/background.jpg") no-repeat center center #f9f9f9;
	text-align:center;
	vertical-align:center;
}

div.flipwall-tile div.flip:hover{
	border:1px solid #999;
	
	/* CSS3 inset shadow: */
	-moz-box-shadow:0 0 30px #999 inset;
	-webkit-box-shadow:0 0 30px #999 inset;
	box-shadow:0 0 30px #999 inset;
}

div.flipwall-tile div.flip  img{
	/* Centering the logo image in the middle of the sponsorFlip div */
	/*
	position:absolute;
	top:50%;
	left:50%;
	margin:-70px 0 0 -70px;
	*/
	margin:auto;
	height:100%;
	width:100%;
}

div.flipwall-tile .title {
	position:absolute; top:0px; left:50%; margin-left:-25%;
}

div.flipwall-tile .entry-meta {
	/* Hiding the .sponsorData div */
	display:none;
}

div.flipwall-tile .description{
	font-size:11px;
	padding:50px 10px 20px 20px;
	font-style:italic;
}

div.flipwall-tile .url{
	font-size:10px;
	font-weight:bold;
	padding-left:20px;
}

.flipwallListHolder .clear{
	/* This class clears the floats */
	clear:both;
}

– Ed

[[email protected]]

Ed – thank you.  That’s a good first step, as it solved the CSS problem and the image looks correct.

The js still is not loading as when I click on the picture it won’t flip.  Any ideas there?

[Swift Ideas – Ed]

Hmm ok. Try adding the following to the Google Analytics box in the Flexform Options > General Options panel – http://pastie.org/7909427

– Ed

[[email protected]]

Thanks Ed.  That didn’t seem to help, it just added the code below the footer on the live page (see attached screenshot).

Would it make any sense to make a custom page type just for this and put the necessary js in there?

[[email protected]]

Good Morning – have you had a chance to look at this again? Still looking to get the JS to work with the theme…Thank you.