Adding WooCommerce to an existing Wordpress site

General PHP Help
#1

Hey there;

I have to modify an existing Wordpress site’s PHP code to make it recognize the WooCommerce plugin. Unfortunately all the examples I can find don’t match the particular Wordpress Theme I am already deeply invested in.

In this video starting at 11:15, the instructions tell me to look for a snippet of PHP code (the loop) and replace it.

Or read the directions here on how to replace the loop.

Unfortunately that code isn’t there, or it’s written a different way which leaves me completely confused as to what to do.

I’ve tried both methods to add Woocommerce and it doesn’t work. It keeps telling me:

"Warning: Cannot modify header information - headers already sent by (output started at /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-content/themes/lupo/functions.php:69) in /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-admin/post.php on line 197

Warning: Cannot modify header information - headers already sent by (output started at /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-content/themes/lupo/functions.php:69) in /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-includes/pluggable.php on line 1167

I’m so frustrated and confused by this. Buying this particular theme was the worst decision I’ve made. It’s been a nightmare to use and the developer doesn’t respond, and I’ve put months of work into the site already so I can’t change the theme. The site looks great now that I’ve bypassed all the problems with the theme.

#2

In my experience, "Warning: Cannot modify header information " , almost always means you are displaying text in PHP before
the page’s headers are sent to the browser. (Only one header per posted page can be handled in a browser.) So, you need to
check where the plugin is placed. It can not send out data to the browser before you display the HTML headers. Does that
make sense to you?

Did you do all of the replacement of the loop at one time? I suggest that you start over with the page.php file and just do the
first part. See if the site will come up without errors. Then, if it does, attempt adding in the hooks one at a time as needed.

If you want help further, we would need to see more of your own code…

#3

That’s an awesome help. Thank you. I’m not a PHP coder, so I’ll just tinker with it until I either get it or die tryin’. I now know more than I did a few days ago thanks to you. I’ll let you know how I do. Thank you!

Much appreciated. :slight_smile:

#4

You are welcome! TO explain it a little further…

If you have code in a plug-in, it is an added in code. It must be inserted into the main WP system in the correct place and
quite often it is placed before the headers. Headers do not mean your website’s heading. A heading is the top part of your
site that usually stays the same on every page. Headers are what the combined PHP and HTML code sends to the browser
before it send the rest of the page. A WordPress site uses templates as you know. These are customized using PHP code
in the form of options and plug-ins. The main WP template governs what is normally sent to the browser. You include a new
plug-in which is added into the mix. Normally, the plug-in includes a list of files. They are called with a “hook” which is just
a term meaning a place-holder that calls the plug-in and makes the rest of the PHP code inside the plug-in get put into the
correct place in the full web page.

What this explanation means is that there are a lot of places that can fail. First, the plug-in can not be installed correctly.
Normally, this is done by an install process which is different for each plug-in. Quite often it is just an include of types. Some
plug-in’s include their own install systems which are handled thru WP in the control panel. Then, once in place, the hook
is placed where the new code is needed. It is actually a simple process. But, if you place anything out of order, then, you
get the errors you are now seeing.

If you keep getting the same issues, post more of the individual code segments. Especially where the error message says
the errors are. A few lines before and after will help us. My personal guess is that you placed the calling code in the wrong
place and it is sending data out before your website page headings…

#5

Hey Ernie;

I suspect that I have simply placed the hook in the wrong place, but to be truthful I have absolutely no idea what I’m doing when it comes to PHP. I taught myself HTML and CSS, and a pretty good understanding of Wordpress, but now I’m only just starting in on PHP and it’s overwhelming in some ways. In particular this problem is way beyond my abilities and bravery, and yet I’m tackling it… unsuccessfully.

Here’s my site. It’s just me.
http://grafikdesigngroup.com

I’m trying, but really I’m so frustrated I just want to just quit. All I’m trying to do is add Woocommerce so I can sell some of my art prints if I’m lucky. The theme I purchased is complete crap, full of bugs, and the developer is one guy with no team and a day job so he never gets around to fixing anything or even getting back to customers. I will forever be using well established themes after this. Themes that are Woocommerce ready.

Now I just need to fix my own site and never deal with this issue again. I wish I could pay you to help me. Being a starving artist sucks.

#6

Well, we are here to help you out! No payment needed! Let’s just solve it…

First, looking at most of your pages on the site you posted, there is one error. It might be your problem. If you RIGHT-CLICK
on most of the pages from the menus and VIEW-SOURCE of the pages, you will see one bad DIV tag on each page. So, this
means that you have either one too many opening

's or most likely, one missing closing
tag. Fix that first !

Now, to do that you can make test copies of one page and delete matching

sections. From
to
…
Eventually, you will find where the missing one is supposed to be.

To find missing tags, you need to use an editor that marks them for you. What PHP editor are you using? If you use one
like Netbeans, the errors are marked on the right side of the display and are easy to find. Let us know which editor you use
to make changes to your code…

#7

I’m so sorry to be taking so long to reply in this thread. I’m actually going to attempt the changes and solutions tomorrow, and see how far I get. As for marked markup language, Dreamweaver has lovely coloured markup, so that’ll be the best choice for me to use. Okay, I’ll tackle that in the morning. deep breath

#8

Also I just saw the extra close div tag /DIV tag in the code for the home page. I’ll look at the other pages and see if there are any there. Firefox shows them clearly in red when I simply view the source code.

#9

Okay, that was an extra end tag I left in the footer.php file. So it appears on every page of the site. Thanks for that. it’s gone now.

Of course as soon as I updated the file in Wordpress, it gave me that warning AFTER I saved the page… which it does just fine.

Warning: Cannot modify header information - headers already sent by (output started at /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-content/themes/lupo/functions.php:69) in /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-includes/pluggable.php on line 1167

So I’m gonna fly out on a limb and state that the problem is definitely with the woocommerc.php file, which was modified (by me) to add Woocommerce hooks.

Here’s the original code. ( page.php )
The Wordpress tutorials instruct me to duplicate this file and then rename it as Woocommerce.php - Then to modify that file. - see code below

HERE is the instruction page, but as you can see, this themes php code is not very similar to the instruction pages example. Which is why I’m confused.

Here’s the code from the page.php file

page.php (duplicated and renamed to woocommerce.php)

<?php get_header(); ?> <?php /*-----------------------------------------------------------------------------------*/ /* SET CONTENT WIDTH /*-----------------------------------------------------------------------------------*/ $sidebar = get_field('sidebar_position'); if ($sidebar == "none" || $sidebar == "") { $span_size = "col-md-12"; } if ($sidebar == "left" || $sidebar == "right") { $span_size = "col-md-8"; } /*-----------------------------------------------------------------------------------*/ /* LOAD CONTENT /*-----------------------------------------------------------------------------------*/ ?> 
		<?php if (get_field('hero_text')) { ?>
			<div class="hero-container">
				<?php the_field("hero_text"); ?>
			</div>
		<?php } ?>
	
		<!-- LEFT SIDEBAR -->
		<?php if ($sidebar == "left") { ?>
			<?php if ( is_active_sidebar(get_field("sidebars"))) { ?>
			<div class="col-md-4 widget-area widget-left">
				<?php dynamic_sidebar(get_field("sidebars")); ?>
			</div>
			<?php } ?>
		<?php } ?>
		
		<!-- MAIN CONTENT -->
		<div class="<?php echo esc_attr($span_size); ?>">
			<?php while (have_posts()) : the_post(); ?>
				<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
					<div class="entry-content">
					<?php the_content(); ?>		
					</div>	
				</div>
			<?php endwhile; ?>
			<?php wp_reset_query(); ?>

			<div class="single-comments">

				<?php $comment_count = get_comment_count(); ?>
		 		<?php if ($comment_count['approved'] > 0) : ?>
			 		<?php if (comments_open()) { ?>

					<h4 class="small-title"><?php comments_number(); ?></h4>

					<?php } ?>
				<?php endif; ?>
					
				<?php 
				global $withcomments;
				$withcomments = true; 
				comments_template(); ?>

				
			</div>

		</div>
		
		<?php if ($sidebar == "right") { ?>
			<?php if ( is_active_sidebar(get_field("sidebars"))) { ?>
				<div class="col-md-4 widget-area widget-right">
					<?php dynamic_sidebar(get_field("sidebars")); ?>
				</div>
			<?php } ?>
		<?php } ?>
		
	</div>
</div>
<?php get_footer(); ?>
#10

I’m guessing it’s lines 51 to 57 that have to be replaced.

		 		<?php if ($comment_count['approved'] > 0) : ?>
			 		<?php if (comments_open()) { ?>

					<h4 class="small-title"><?php comments_number(); ?></h4>

					<?php } ?>
				<?php endif; ?>
#11

Warning: Cannot modify header information - headers already sent by (output started at /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-content/themes/lupo/functions.php:69) in /homepages/35/d283039769/htdocs/clickandbuilds/GrafikDesignGroup/wp-includes/pluggable.php on line 1167

This says that you need to look at file functions.php line#69

and file pluggable.php line 1167 and post a few lines before and after of each and maybe we can sort it out. That error
message does not mention the woocommerc.php file at all. So, it must be something else you are missing…

Also, PLEASE PLEASE PLEASE post your code INSIDE the PHP tags. When you do that, you can use the PREVIEW
button and mention the line numbers giving you issues. We can not see your lines 1167 and 69… No idea what code is
really showing for those line numbers… Does this make sense…?

Example from your last post:
[php]
<?php if ($comment_count['approved'] > 0) : ?>
<?php if (comments_open()) { ?>

              <h4 class="small-title"><?php comments_number(); ?></h4>

              <?php } ?>
           <?php endif; ?>

[/php]
Which is line #51 and which is #57? See what I mean… Post the two other pages and areas that are indicated in the
error message. Two PHP tag areas so we can see each group of 10 to 20 lines and might be able to help you sort it out.

#12

Oh man, sorry 'bout that. I will from now on use the PHP tags. And yes, that makes perfect sense. Good programming by the way (in regards to the PHP tags).

Okay, now I just need to crack this problem. Time to start tinkering.

Here’s the functions.php file.

[php]<?php

/*-----------------------------------------------------------------------------------

FUNCTIONS
-----------------------------------------------------------------------------
Editing this file will break the theme and possibly the universe.
This file connects to our awesome framework.

-----------------------------------------------------------------------------------*/

/-----------------------------------------------------------------------------------/
/* Paths
/-----------------------------------------------------------------------------------/

$moonbear_customizer_path = get_template_directory().’/framework/customizer’;
$moonbear_tgm_path = get_template_directory().’/framework/tgm’;
$moonbear_importer_path = get_template_directory().’/framework/importer’;
$moonbear_hooks_path = get_template_directory().’/framework/hooks’;

/-----------------------------------------------------------------------------------/
/* Paths
/-----------------------------------------------------------------------------------/

require_once(get_template_directory()."/framework/functions.php");
require_once($moonbear_customizer_path . ‘/init.php’);
if (!get_option(“moonbear_installed”)) {
require_once($moonbear_importer_path . ‘/setup.php’);
}
require_once($moonbear_hooks_path . ‘/hook_mobile_navigation.php’);
require_once($moonbear_hooks_path . ‘/hook_navigation.php’);
require_once($moonbear_hooks_path . ‘/hook_post.php’);
require_once($moonbear_hooks_path . ‘/hook_single_portfolio_slider.php’);
require_once($moonbear_hooks_path . ‘/hook_style_switcher.php’);
?>

[/php]

and here’s what I had… which is clearly not working.

[php]<?php

/*-----------------------------------------------------------------------------------

FUNCTIONS
-----------------------------------------------------------------------------
Editing this file will break the theme and possibly the universe.
This file connects to our awesome framework.

-----------------------------------------------------------------------------------*/

/-----------------------------------------------------------------------------------/
/* These two lines avover “paths” were added to make WooCommerce work.
/-----------------------------------------------------------------------------------/

remove_action( ‘woocommerce_before_main_content’, ‘woocommerce_output_content_wrapper’, 10);
remove_action( ‘woocommerce_after_main_content’, ‘woocommerce_output_content_wrapper_end’, 10);

/— 2nd thing to add —/

add_action(‘woocommerce_before_main_content’, ‘my_theme_wrapper_start’, 10);
add_action(‘woocommerce_after_main_content’, ‘my_theme_wrapper_end’, 10);

function my_theme_wrapper_start() {
echo ‘’; /* was echo ‘’; …but I changed it to match the page.php */
}

function my_theme_wrapper_end() {
echo ‘’;
}

/— 3rd thing to add —/

add_action( ‘after_setup_theme’, ‘woocommerce_support’ );
function woocommerce_support() {
add_theme_support( ‘woocommerce’ );
}

/-----------------------------------------------------------------------------------/
/* Paths
/-----------------------------------------------------------------------------------/

$moonbear_customizer_path = get_template_directory().’/framework/customizer’;
$moonbear_tgm_path = get_template_directory().’/framework/tgm’;
$moonbear_importer_path = get_template_directory().’/framework/importer’;
$moonbear_hooks_path = get_template_directory().’/framework/hooks’;

/-----------------------------------------------------------------------------------/
/* Paths
/-----------------------------------------------------------------------------------/

require_once(get_template_directory()."/framework/functions.php");
require_once($moonbear_customizer_path . ‘/init.php’);
if (!get_option(“moonbear_installed”)) {
require_once($moonbear_importer_path . ‘/setup.php’);
}
require_once($moonbear_hooks_path . ‘/hook_mobile_navigation.php’);
require_once($moonbear_hooks_path . ‘/hook_navigation.php’);
require_once($moonbear_hooks_path . ‘/hook_post.php’);
require_once($moonbear_hooks_path . ‘/hook_single_portfolio_slider.php’);
require_once($moonbear_hooks_path . ‘/hook_style_switcher.php’);
?>

[/php]

#13

Lum, perhaps I am not sure exactly what you are doing. Let’s start over to make sure we are on the same page…

The WooCommerce is a plug-in that you are attempting to add to a current WP site. But, the site you posted talks mostly about
adding your WP template to their template. It is confusing when you read it. So, I understand your problems with it. Now, as far
as your WP template that you used before integrating the WooCommerce plug-in, you should have a folder named Templates
in your WP folder. Inside that should be a page.php file or another folder named pages that contains the page.php file. This is
just a basic template that uses your theme and layout for your general layout of a page. Duplicating it gives you a blank page
with all of your general template in place.

Now, your original site looks nice and fancy. Did you purchase that template from Evanto or Themeforest? If so, you can
get some support from them. But, re-reading the instructions are confusing. If you read it again, you will see that there are
two ways to add this to your site. Either, create a new page, placing the Woo “content” in the page instead of all the other
items in a page. Or use a “hook” to place it into your WordPress code system. I did not read it all originally as you were
showing error messages, so I was concentrating on those. Sorry I did not read thru it all first.

The install page says you need to remove the “wrappers” on the Woo content and then add your own in. To do that, you do
need to know what your wrappers are for your current site. If this was a purchased template from the above sites, there will
be a great documentation section in the templates folder under a folder called documents, docs or other similar name. In
there, you should find an index.html file that once run will show the docs for the template. Then, in that doc, you should find
a section about how to add pages. You would need to read that section and place your “un-wrapped” Woo content in the
new page.

Hmmmmm… Did that make sense or confuse you further?

#14

Unfortunately this template was purchased from Envato. It’s got problems right out of the box and has no support. I’ve contacted the author many many times and he’s not responding.

Unfortunately this theme is not Woocommerce ready, so I’m attempting to modify it to allow it to show the Woocommerce content without breaking the appearance and carefully tailored style of the site (which I customized using CSS and one or two PHP additions (made by a friend).

Yeah, there are two ways to add Woocommerce-friendly changes, and both are confusing to me. Sorry, but I’m not a PHP coder so this stuff is virtual Greek to me.

#15

Yep, I knew it was from Envato… Even if I did spell it wrong. I recently purchased one for a client and it was great with a huge amount of documentation on it.

So, since it is a customized WP template, I would have to learn a bit about the Woo system before I can help further. I will read
up on it some and get back to you… The main Lupo template seems straight forward. But, it is not really a standard WP one!
It is customized… I will read up on both and see if I can figure it out for you…

#16

Ernie. You are awesome!
Yeah, I installed the plugin and then set about trying to get my site to acknowledge the Woo content ina way that fits with my template’s style.

So far I don’t even know yet how to get anything going in that regard. Not easy.

#17

Lumdingo, did you finish getting this working. I got really busy and forgot to check back in with you…

Hopefully, you solved it all… The hard part of working with a template is that you are locked into their design and code
until you learn all of it and then you can customize it to fit your needs. Sometimes that is not a long process, but, since
you have multiple layers involved, such as WP, PHP, template, back-end WP control panel, etc…, you have a lot of “parts”
that you have to learn…

Good luck. Let us know if it is solved and we will mark it so. If you have another issue, please let us know…

#18

Hey Ernie;

Yeah I did. I kinda just had to remove all the extra instruction and just go with the basic installation. A neighbour showed me how it works. For some strange reason when I trued it myself it just didn’t work.

It works now and looks good.

http://grafikdesigngroup.com/shop

On my phone, it still presents the cart items in rows of two side my side, but that’s okay.

#19

Well, the phone issue might look different on different phones. All phones have different resolutions. Some templates have ways to fit the items in place for all phones.

But, looks good! I will mark this solved and we will see you back here when you get stuck on the next puzzler…

#20

Cheers. Yeah I’ve added extra mobile CSS attributes to change it on mobile devices. It looks perfect now.

Thanks.

Sponsor our Newsletter | Privacy Policy | Terms of Service