URL Field not appearing correctly in anchor - wordpress

I have run into a very interesting problem. I am working on a site for a client of mine and have run into this issue using Advanced Custom Fields no wordpress. I have added a new custom field to the site for their rewards program spot, and I am having trouble getting the url field to work corretly. I have the code added to the template php file that it needs to be in and it looks like this at the moment.
<div class="row">
<?php $ficvalue = get_field('free-icecream-url');
if ($ficvalue) {
$ficurl = esc_url($ficvalue);
}?>
<h3 class="heading" style="text-align: center;"><?php the_field('free-icecream-header'); ?></h3>
<a href"<?php echo $ficurl; ?>" class="btn btn-primary" style="max-width: 15em;"><?php the_field('free-icecream-btn'); ?></a>
</div>
When I put the url into the custom url field on the backend in the page editor, it doesn't appear in the anchor correctly. if I add this line to the page, it shows the url correctly on the page itself:
<?php echo get_field('free-icecream-url'); ?>
This will show the url as it is inserted into the custom field, however adding it into the anchor's href like this provides a different result.
<?php the_field('free-icecream-btn'); ?>
<!-- results as the following in chromes inspect -->
<!-- https: www.rococoicecream.com rococo-rewards
Instead of https://www.rococoicecream.com/rococorewards -->
I have tried to use esc_url() and esc_html() to no avail. and when using the_field() it yields the same results. What am I doing wrong?

The answer to my question here was answered shortly after posting it. I updated the original question but I will also place it here. I found the problem I was having was that I missed a = after the href in the anchor for my button. After finding that out, it works like a charm.

Related

ACF - image as a subfield

so after a lot of researching and trials and errors, I come to you. This seems to be very basic and still no luck. The issue is that my image does not appear and in the console it gives me an <img src (unknown) />.
So, in my ACF, I have a field called first_row that contains sub fields, one of the is called left_side_bg. It's attributes are all standard, and is set to return an Image Array. As a side note, I have another subfield called left_side_text.
On my php file, I'm trying to retrieve it like this:
<?php
$info = get_field('first_row');
$left_side_bg = get_sub_field('left_side_bg');
?>
<div class="single-banner">
<img src="<?php echo $left_side_bg['url']?>" alt="">
<div class="inner-text">
<h4><?php echo $info['left_side_text']; ?></h4>
</div>
</div>
The left_side_text shows fine, but no luck with the image... is there anywhere I can double check or debug this better, or am I fetching the data incorrectly?
As a side note, I have tried different ways to retrieve the image by changing to Image URL, Image ID (in the ACF custom editor) and so on, but no luck, so I returned to the original format I tried to get the image the first time with all the ACF fields as default (getting the Image as an Array).
get_sub_field() is meant for Repeaters and Flexible Content (rows). I assume left_side_bg and left_side_text are in the same group. Therefore, try it like so:
<?php
$info = get_field('first_row');
?>
<div class="single-banner">
<img src="<?php echo $info['left_side_bg']['url']?>" alt="">
<div class="inner-text">
It also makes a difference to what your Return Value is configured. I hope it is set to "Image Array". Otherwise, you might have to omit the ['url'] if it's "Image URL" instead.
If that isn't working, it might be a good idea to post a screenshot of what your ACF field configuration (field group) looks like.

Wordpress Modal contact form using CF7 and Easy Fancybox not working?

I have been attempting to create a modal contact form using the two plugins: Contact Form 7 and Easy Fancy Box.
I am also using visual composer in order to build my site..
I have therefore created a 'Raw Html' element, and in the element I have the following code:
Contact Us
<div style="display:none" class="fancybox-hidden">
<div id="contact_form_pop">
<?php echo do_shortcode('[contact-form-7 id="4" title="Contact form 1"]'); ?>
</div>
</div>
This does not work and the browser seems to comment out the php code, I know that php is a server side language but I was simply following a tutorial I found. The result is this when the button is clicked:
I then tried the code without the php and wordpress' 'do_shortcode', as another tutorial instructed:
Contact Us
<div style="display:none" class="fancybox-hidden">
<div id="contact_form_pop">
[contact-form-7 id="4" title="Contact form 1"]
</div>
</div>
This also didn't work and resulted in:
If anyone could help me to circumnavigate these issues and create a modal/pop-up contact form whilst using visual composer (I ahve built most of my site using it) I would be extremely greatful!
The code you pasted exactly works, the problem is that the shortcode is not picked up by wordpress. Make sure you paste the code in a text block, and the mode of the text block is 'Text' not 'Visual'.
Just tested and it works fine.
instead of only typing the shortcode use the correct function:
<?php echo do_shortcode('[contact-form-7 id="4" title="Contact form 1"]'); ?>
if you want to store the shortcode inside a php variable, you can use this:
$my_shortcode = '[contact-form-7 id="4" title="Contact form 1"]';
echo do_shortcode( $my_shortcode );

How do I create different editable sections within a WordPress page?

I have been building my first theme on WordPress and have run into problem while adding content into different sections.
My HTML is somewhat like this,
<div id="maintext">
<-- Text -->
</div>
<div id="products">
<-- Text and Images -->
</div>
<div id="about_company">
<-- Text boxes -->
</div>
How do I make sure the content added via the WordPress editor falls under the respective divs ? For the "maintext" div I'll load the content from the page itself but how do I add content to the other 2 divs dynamically ?
I searched on a couple of forums and many suggested to add content using widgets, is there any way it can be done without using widgets ?
Any help will be gladly appreciated.
Unfortunately adding multiple editable fields in a single page is not particularly easy using WordPress by itself.
Many WP devs I know (myself included) rely on the Advanced Custom Fields Plugin for additional content fields.
The steps to make this happen:
1) Install the ACF the plug.
2) In the settings area for ACF create some new fields.
3) Assign the new fields to appear for a specific page or set of pages.
4) Update your page-template for the given page(s) so that the new fields are displayed.
For instance you might create a set of standard wysiwyg fields and then assign them to the 'overview' page. Let's call these fields: main_text, products_info and about_company. Once the fields have been created and assigned to a page, when you edit that page the additional fields will be available to edit.
For these new fields to be seen by visitors, they must be added to the page-template you use for your overview page. The code could be something like this:
<div id="maintext">
<!-- Text -->
<?php if(get_field('main_text')){ //if the field is not empty
echo '<p>' . get_field('main_text') . '</p>'; //display it
} ?>
</div>
<div id="products">
<!-- Text and Images -->
<?php if(get_field('products_info')){ //if the field is not empty
echo '<p>' . get_field('products_info') . '</p>'; //display it
} ?>
</div>
<div id="about_company">
<!-- Text boxes -->
<?php if(get_field('about_company')){ //if the field is not empty
echo '<p>' . get_field('about_company') . '</p>'; //display it
} ?>
</div>
There are lots of good examples here. If you are feeling really ambitious, rather than install the plugin you could even include ACF directly in your theme.
You've got three options I believe:
Create a widget area where you can then display the content in a text widget: http://codex.wordpress.org/Function_Reference/register_sidebar
Create a template where you then get the content of a different page: http://codex.wordpress.org/Page_Templates#File_Folders
Create a new meta box for all your pages: http://codex.wordpress.org/Function_Reference/add_meta_box
I believe that the thing you are looking for is option 2. The others are more full-site oriented, if you want the extra content to show up on every single page.
If you are writing the theme, maybe you would like to consider using a WordPress Framework so you don't have to start from scratch.
If that is not the case, think of the end user. How will they add sections to pages and posts? Will they have to move across places within the WordPress UI, or would they rather user short codes?
My recommendation is to build a plugin that render the section within the document content. Or widget content if that is the case.
I wrote a little piece of code to illustrate how you can accomplish such a thing, and also because I kind of need it right now :D. You can find it on github here https://github.com/lionpage/Front-Office-Document-Sections
Hope this helps
<div id="maintext">
<?php the_content(); ?>
</div>
<div id="products">
<?php // echo wp function to get product data; ?>
</div>
<div id="about_company">
<?php // echo wp function to get about companydata; ?>
</div>
I've run into this issue several times now, and while the question is 3 years old, I think it's still rather current. I've succesfully used the Multiple Content Blocks plugin sometimes now:
https://ltz.wordpress.org/plugins/multiple-content-blocks/
After installing the plugin, you can just include the_block in your template:
<div id="maintext">
<?php the_content(); ?>
</div>
<div id="products">
<?php the_block('products') ?>
</div>
<div id="about_company">
<?php the_block('company') ?>
</div>
hi im currently developing a theme with that set up.
there are two ways to achieve this:
widgetized and fixed admin panel (customizer options)
i am using the two in my themes
if widgets
create a .php file that includes the widgets sections
create a widget for that section
if fixed in admin panel
you have to include the .php section in your functions.php
edit * advantage of widgetized is you can arrange them just like in a regular sidebar
Was struggling with this, and did not want to use a plugin. The only WordPress native option I found was to use Custom Fields. This works, but only for text, and is rather cumbersome.
The other non-plugin option is to simply use HTML in the WordPress editor, but this is of course far from ideal either.
Finally I gave up, and opted for the Advanced Custom Fields plugin as well.

Like url from Wordpress incorrect

I'm helping out as admin on a WordPress site and we are adding the ability to "Like" individual post and pages and are using the following code;
<div class="fb-like" data-href=”<?php the_permalink(); ?>” data-send="false" data-width="450" data-show-faces="true"></div>
The Like button displays correctly but the url for some reason has an " added in the end rendering the link to become invalid. If I "echo" the result of the_permalink it displays the correct url.
Example;
Like is clicked on http://my.blog/is-cool/ but the displayed url on my timeline is http://my.blog/is-cool/".
Your double quote marks around the <?php the_permalink(); ?> are incorrect - they are the 'curly quotes'.

Add Link Field in Template in Drupal 6 with CCK

Good Evening,
I'm using Drupal 6, CCK Module, and the Link Field Type. All are installed and activated.
I created a custom content type called Slider. A user can upload an image, a title, and a teaser. I created a custom field for that slider content type as well as one called Link with the field name: "field_link_test".
I created an entry, filled in all of the data including a URL for that link field type and clicked "Save". In views-view-table--slider.tpl.php, I added:
Learn More
but on the front end, everything shows except for that link. I also tried emptying the Drupal cache.
Any ideas?
Update template code below, which all works fine, except for the new link value outputs nothing.
<div id="slider">
<div class="slider-holder">
<?php foreach($rows as $row): ?>
<div class="slide">
<?php print $row['field_image_fid'] ?>
<div class="info-slide">
<h2><?php print $row['title'] ?></h2>
<p><?php print strip_tags($row['teaser']) ?></p>
Learn More
</div><!--INFO-SLIDE-->
</div><!--SLIDE-->
<?php endforeach ?>
</div><!--SLIDER-HOLDER-->
<div id="control">
</div>
</div><!--SLIDER-->
The easy possibilities (which you've probably checked, but just to get them out of the way):
you need to allow the field to be viewable by anonymous/authenticated users in User Management - Permissions
Otherwise, it's hard to tell without some code to analyse. Could you post your entire views-view-table--slide.tpl.php and if possible, your exported view or a link to the exported view?
EDIT
Now that I've had a chance to look at your view, I've made a couple of changes that should help.
The reason your link URL isn't showing is that you're including the "Node: Link" field in your View instead of the "Content: Link (field_link_test)" field. The first one will just link back to the original node rather than your custom link. Also, I don't think you can call the $node variable from views-view-table (at least, I don't get anything when I print it. Instead, you can use the $row variable.
I have a version of your template that prints out the URL in the field "link_test" with the label "Learn More." I put the "Learn More" text in the View itself as that'll be easier to edit and works better with the Link CCK type (which by default will want to add a title you add in the node edit screen).
The view export is here: http://pastebin.me/0ed2942f6953cb00cab1bd5386058a13. You can import this back into your site, but you may want to clone your original View first to make a backup, so that if this isn't what you want, you can use your old version.
The updated tpl is:
<div id="slider">
<div class="slider-holder">
<?php foreach($rows as $row): ?>
<div class="slide">
<?php print $row['field_image_fid'] ?>
<div class="info-slide">
<h2><?php print $row['title'] ?></h2>
<p><?php print strip_tags($row['teaser']) ?></p>
<?php print $row['field_link_test_url'] ?>
<?php //print_r($row); ?>
</div><!--INFO-SLIDE-->
</div><!--SLIDE-->
<?php endforeach ?>
</div><!--SLIDER-HOLDER-->
<div id="control">
</div>
</div><!--SLIDER-->
Let me know if you have any issues/questions.
Are you sure the template is getting picked up (add <p>heavymark</p> above the href... does it show up?)?
If above shows up, add a var_dump($node) above the anchor tag and post the output so we can get a better idea of what's there (you probably want to enable XDebug so you get better formatted output, if its not on already).
Make sure you add the link field to the view in the fields section. This should allow it to be themeable from within your template file. If you are still not seeing it, try using
print_r($rows,1);
or some variable of print_r to view all the rows that are available to be themed.

Resources