Title: PHP and HTML markup inside function
Last modified: August 20, 2016

---

# PHP and HTML markup inside function

 *  [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/)
 * Hi!
 * I am using the following function to place addthis share buttons after the content
   of each post:
 *     ```
       function diww_add_post_content($content) {
       	if (is_single()) {
       		$content .= '<div class="addthis_toolbox addthis_default_style">
       <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
       <a class="addthis_button_tweet"></a>
       <a class="addthis_button_pinterest_pinit"></a>
       <a class="addthis_counter addthis_pill_style"></a></div>';
       	}
       	return $content;
       }
   
       add_filter ('the_content', 'diww_add_post_content', 0);
       ```
   
 * It’s working fine, but I also want to add a button for sharing on the site FANCY.
   com which mixes PHP and HTML and I can’t figure out how to “open” and “close”
   each PHP snippet. Here is the FANCY button code:
 *     ```
       <a id="FancyButton" href="http://www.thefancy.com/fancyit?ItemURL=<?php the_permalink(); ?>&Title=<?php echo get_the_title(); ?>&Category=Men's&ImageURL=<?php if(function_exists('the_post_thumbnail')) echo wp_get_attachment_url(get_post_thumbnail_id()); ?>">Fancy</a>
       ```
   
 * I don’t know PHP…can someone please help me properly open and close this to work
   inside the function above?
 * Thanks!

Viewing 8 replies - 1 through 8 (of 8 total)

 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288656)
 * Insert the following code below the last `<a class=...` line and above the curly
   brace ‘}’ and the `return $content;` line.
 *     ```
       $content .= '<a id="FancyButton" href="http://www.thefancy.com/fancyit?ItemURL=';
       $content .= get_permalink();
       $content .= '&Title=';
       $content .= get_the_title();
       $content .= '&Category=Men\'s&ImageURL=';
       if(function_exists('the_post_thumbnail')) $content .= wp_get_attachment_url(get_post_thumbnail_id());
       $content .= '">Fancy</a>';
       ```
   
 * Untested, hopefully I didn’t make a dumb syntax error. Good luck.
 *  Thread Starter [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288665)
 * Thanks! Yes, it works! I really appreciate it.
 * One other question: Is it possible to style this div? No matter where I try to
   place some CSS, it has no effect. I want to move the div down.
 * Thanks again!
 *  Thread Starter [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288668)
 * Hi, sorry to trouble you but after further testing there is one small problem.
   It’s popping up an error saying it can’t find the path to the image…but it is
   finding the path and it’s working properly. Can you think of any reason why, 
   when using this code, it’s showing a false error message?
 * Thanks!
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288681)
 * Speaking of divs, I didn’t pay much attention to what I was doing, thefancy button
   code is not in the div with the rest of the buttons. To make it so, cut the `
   </div>` out of the end of the last `<a class=...` line, such that the single 
   quote and semi-colon follow the `</a>` tag. Paste that `</div>` in the similar
   location of the last line of the code I provided so it looks like `$content .
   = '">Fancy</a></div>';`
 * Yes, you should be able to move the div down. Styling WP can be a nightmare. 
   Combined with CSS often being confusing anyway, like the ‘top’ style only works
   with certain ‘position’ styles. (Or something like that, I can’t keep it straight)
   You really need a CSS analysis tool to know where to adjust the style. Firefox
   has the Firebug plugin for this, other browsers have similar tools built in. 
   Even once you determine the right place to edit the styling, sometimes you still
   need to add the ‘!important’ modifier to your rule to get it to take effect.
 * If you get really desperate, you could add a style attribute directly to the `
   <div>` html code. Not recommended, but a possibility.
 * For the image error thing, you might check the html source of the buttons in 
   your browser and verify the thumbnail url that’s passed to thefancy.com is completely
   correct in form and syntax. Also, I’m surprised the url in this situation is 
   not urlencoded. You might try that to see if it helps. In my code, make the part
   after the if() portion look like
 *     ```
       $content .= urlencode(wp_get_attachment_url(get_post_thumbnail_id()));
       ```
   
 * Alternately, it may break the button, but worth a try.
 * I hope you can make sense of all of this. Cheers.
 *  Thread Starter [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288682)
 * Hi!
 * Thank you SO MUCH for all of the information and advice. I will give everything
   a try. Yes, the CSS is tricky. I’m pretty good with CSS and have tried everything,
   including adding styling to the div itself (as in <div style=”margin-top: 20px!
   important;”), as well as naming the div and adding styling to the style.css…but
   nothing works. I thought it’s because it’s in a function which I’m not familiar
   with styling within a function. Guess I’ll keep trying.
 * Anyway, thanks again!
 *  Thread Starter [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288683)
 * Hi!
 * Perhaps I can trouble you one more time. I have a clue regarding the image error.
   In the html source, the Fancy.com share button image path link getting the error
   looks like this:
 * `ImageURL=http%3A%2F%2Fmysite.com%2Fwp-content%2Fuploads%2F2012%2F10%2Fthe_image.
   jpg`
 * Notice the slashes are being replaced by %2F.
 * But in my live site where the Fancy.com button functions without error, the image
   path link looks like this:
 * `ImageURL=http://mysite.com/wp-content/uploads/2012/10/the_image.jpg`
 * Notice the slashes are correct.
 * Does this tell you why the error is happening, and perhaps how to correct it?
 * BTW, I tried adding the the urlencode and that had no effect.
 * Thanks!
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288685)
 * CSS. Arrrgh! Yes, sometimes margins do not seem to work. top seems reliable IF
   the position style of the container and it’s parent are right. Keep trying, something
   will work. A good approach would be to get it working with the tag’s style attribute,
   then move it to the css file and hope it still works.
 * Urlencode basically hex encodes the slashes among a few other characters, I had
   thought the slashes may have been causing the problem. Seems to be the other 
   way around. I can’t imagine where else this happens. AFAIK, wp_get_attachment_url
   returns true slashes. The ‘the_content’ filter gets immediately echoed out to
   the browser on return. Could there be another hook to ‘the_content’ processing
   the content? Some plugin? Not sure why a plugin would do that, grasping at straws
   I guess.
 * Since you have a functional link, it’s clear the hex encoding needs to be stopped.
   Assuming you’ve since removed my useless urlencode idea, I don’t know where else
   this could be happening.
 *  Thread Starter [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * (@xiabolai)
 * [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288686)
 * Okay, thank you again for all of your help. I’ll keep trying the CSS as well 
   as the Fancy.com button image path issue. There’s absolutely no reason for it
   to trigger an error pop-up…it’s working fine. One of those vexing problems that’s
   probably just too simple to notice.
 * Thanks!

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘PHP and HTML markup inside function’ is closed to new replies.

## Tags

 * [function](https://wordpress.org/support/topic-tag/function/)
 * [html](https://wordpress.org/support/topic-tag/html/)
 * [php](https://wordpress.org/support/topic-tag/php/)

 * In: [Hacks](https://wordpress.org/support/forum/plugins-and-hacks/hacks/)
 * 8 replies
 * 2 participants
 * Last reply from: [xiabolai](https://wordpress.org/support/users/xiabolai/)
 * Last activity: [13 years, 5 months ago](https://wordpress.org/support/topic/php-and-html-markup-inside-function/#post-3288686)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics