Show 'Advanced Custom Field' Image - image

I'm having problems getting the image field from Advanced Custom Field plugin. I'm using it to set an image for custom taxonomy category named "aktuelni_ponudi_category". I have displayed the name of the category and its link, but can't fix the problem with the image. I also want to create a shortcode, so here is my code:
function my_vc_shortcode( $atts ) {
$categories = get_categories( array(
'taxonomy' => 'aktuelni_ponudi_category',
'hide_empty' => '0',
'order' => 'DESC'
)); ?>
<div class="row">
<?php
foreach($categories as $category) { ?>
<div class="col-md-4">
<a href="<?php echo get_category_link($category->cat_ID); ?>">
<?php echo $category->name; ?>
</a>
<?php echo '<img src="' . the_field('acf_image') . '">'; ?>
</div>
<?php }
?>
</div>
<?php }
add_shortcode( 'my_vc_php_output', 'my_vc_shortcode');
I'm hoping for an answer...

If you use custom fields on a taxonomy term there is a special syntax to get that data: you should call the field function with a parameter composed of the taxonomy name and the term id, like here:
the_field('acf_field','aktuelni_ponudi_category_' . $category->cat_ID);
You can read more about it here: https://www.advancedcustomfields.com/resources/get-values-from-a-taxonomy-term/

Related

How to create an Ajax Filter to display custom post types in WordPress

I asked a question to this topic before but since it seems like this requires just custom coding, I need help from the experts. I am not a coder, I design and build website in Webflow but want to learnt to convert them to a WordPress theme.
I have a Custom Post Type and want to display all of these posts on a page, however, above the displayed posts I want a filter, so that the user can click on a category and only see custom posts for that category (without page reload).
I registered a custom taxonomy and added categories for this. I see this on so many website, this seems to be a super common thing, and that's why I am so surprised that there is no plugin to achieve that. But anyway, here is an example of what I want to achieve: https://www.hauserlacour.de/en/work
I know that it has something to do with custom queries and AJAX. But I couldn't find a beginner friendly tutorial to achieve what I need.
Can anyone help me with the code below and what is needed to turn my custom taxonomy into a filter?
And here is the code I have as of now:
<?php get_header( 'page-posttest' ); ?>
<div class="projekte-wrapper-1">
<?php $terms = get_terms( array(
'taxonomy' => 'art',
'orderby' => 'name',
'order' => 'ASC',
'hide_empty' => false
) ) ?>
<?php if( !empty( $terms ) ) : ?>
<div class="taxonomy-wrapper">
<?php foreach( $terms as $term ) : ?>
<?php echo $term->name; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php
$projekte_query_args = array(
'post_type' => 'projekte',
'nopaging' => true,
'order' => 'ASC',
'orderby' => 'date'
)
?>
<?php $projekte_query = new WP_Query( $projekte_query_args ); ?>
<?php if ( $projekte_query->have_posts() ) : ?>
<div class="posts-wrapper">
<?php while ( $projekte_query->have_posts() ) : $projekte_query->the_post(); ?>
<?php PG_Helper::rememberShownPost(); ?>
<?php $image_attributes = !empty( get_the_ID() ) ? wp_get_attachment_image_src( PG_Image::isPostImage() ? get_the_ID() : get_post_thumbnail_id( get_the_ID() ), 'full' ) : null; ?>
<h1 class="heading-14"><?php the_title(); ?></h1>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
</div>
<?php else : ?>
<p><?php _e( 'Sorry, no posts matched your criteria.', 'test' ); ?></p>
<?php endif; ?>
</div>
<?php get_footer( 'page-posttest' ); ?>

How to load database into helper and display in view with specific column

footer_helper
<?php
function get_gadget_footer() {
//the database functions can not be called from within the helper
//so we have to explicitly load the functions we need in to an object
//that I will call ci. then we use that to access the regular stuff.
$ci=& get_instance();
$ci->load->database();
//select the required fields from the database
//$ci->db->select('name, type, setting');
//tell the db class the criteria
$ci->db->where('display', 'Footer');
//supply the table name and get the data
$query = $ci->db->get('gadgets');
foreach($query->result() as $row):
$type['name'] = $row->name;
$type['type'] = $row->type;
var_dump($type);
endforeach;
return $type;
}
hi this is my helper page. var_dump($type) is returning me required result in form of array as:
var_dump($type)
array (size=2)
'name' => string 'Quick Links' (length=11)
'type' => string '<a href='www.facebook.com'>Facebook</a><br>
<a href='#'>Twitter</a><br>
<a href='#'>Salyani</a><br>
<a href='#'>B&W</a><br>' (length=123)
array (size=2)
'name' => string 'Social Network' (length=14)
'type' => string '<a href='#'>Facebook</a><br>
<a href='#'>Facebook</a><br>
<a href='#'>Facebook</a><br>
<a href='#'>Facebook</a><br>' (length=115)
Now in my view page. I want display specific record in div. Like record of name
record of type .
Since now i had done following:
view
<?php
$this->load->helper('footer_helper');
$name = get_gadget_footer();
?>
<div id="footer">
<div id="footer_gadget_collection">
<?php
foreach ($name as $dat){
?>
<?php
?>
<div id="footer_subgadget">
<div id='title'><?php echo $dat['name']; ?></div>
<div id='description'><?php $dat['type']; ?> </div>
</div>
<?php
}
?>
But, its giving me error. Please help me.
In your helper you are restting the name/type of the array, not building it.
It should be something like;
<?php
//supply the table name and get the data
$query = $ci->db->get('gadgets');
$type = array();
foreach ($query->result() as $row) {
$type[] = array('name' => $row->name, 'type' => $row->type);
}
return $type;

Form is not getting submitted when render partial in Yii

I am partially rendering a form in a view in which user can add subaccounts(profiles). The view in which the form is called is another form where all subaccounts are listed as radiolist.
Below is my view.
<div class="inputs">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'selectUser-form',
'enableAjaxValidation' => false,
)); ?>
<?php echo CHtml::activeRadioButtonList($model,'id', $model->getSubAccounts(),array('prompt'=>'Please Select'));?>
<?php echo CHtml::submitButton($model->isNewRecord ? 'Book Now' : 'Save'); ?>
<?php echo CHtml::Button('Cancel',array('submit'=>array('cancel','id'=>$model->a_id)));?>
<?php $this->endWidget(); ?>
<div id="data"></div>
<?php echo CHtml::ajaxButton ("Add Users",
CController::createUrl('/user/user/addSubAccount'),
array('update' => '#data'));
?>
Below is my addSubAccount action.
public function actionAddSubAccount()
{
$profile=new YumProfile;
if (isset($_POST['YumProfile']))
{
$profile->attributes = $_POST['YumProfile'];
$profile->user_id=Yii::app()->user->id;
if($profile->save())
$this->redirect(array('/home/create'));}
if(!Yii::app()->request->isAjaxRequest){
$this->render('subaccount_form', array('profile'=>$profile));}
else{
$this->renderPartial('subaccount_form', array('profile'=>$profile));
}
}
Below is subaccount_form.
<?php $this->title = Yum::t('SubAccounts');?>
<div class="wide form">
<?php $activeform = $this->beginWidget('CActiveForm', array(
'id'=>'subaccount-form',
'enableAjaxValidation'=>true,
'enableClientValidation'=>true,
'clientOptions' => array(
'validateOnChange' => true,
'validateOnSubmit' => true,
),
));
?>
<div class="row"> <?php
echo $activeform->labelEx($profile,'Firstname');
echo $activeform->textField($profile,'firstname');
echo $activeform->error($profile,'firstname');
?> </div>
<div class="row"> <?php
echo $activeform->labelEx($profile,'Lastname');
echo $activeform->textField($profile,'lastname');
echo $activeform->error($profile,'lastname');
?> </div>
<div class="row"> <?php
echo $activeform->labelEx($profile,'Age');
echo $activeform->textField($profile,'age');
echo $activeform->error($profile,'age');
?> </div>
<div class="row submit">
<?php echo CHtml::submitButton(Yum::t('Add')); ?>
</div>
<?php $this->endWidget(); ?>
My form is rendering. But it's not getting submitted.What am i doing wrong?
After submitting,I need the view to be refreshed and to display the newly added user as an option in the radio list.
EDIT:
I tried like adding the following in the CActiveForm Widget array:
'action' => array( '/user/user/addsubAccount' ),
But still no result.Instead it is saving my data two times when i go through my direct way,meaning render method. :-(
It is because
'enableAjaxValidation'=>true,
Ajax validation is set to true in your form. Set its value to false
'enableAjaxValidation'=>FALSE, and then your form will submit :)
and if you want it to be true only then you should uncomment
$this->performAjaxValidation($model);
in your controller's action
Update 1
if(!Yii::app()->request->isAjaxRequest){
$this->render('subaccount_form', array('profile'=>$profile));}
else{
//change this line
$this->renderPartial('subaccount_form', array('profile'=>$profile),FALSE,TRUE);
}
This link might help you
on renderPartial the action attribute of the form is set to the current page instead of being set to the actual update or create url
My Solution
$form=$this->beginWidget('CActiveForm', array(
'id'=>'country-form',
'action' => Yii::app()->createUrl(is_null(Yii::app()->request->getParam('id'))?'/country/create':'/country/update/'.Yii::app()->request->getParam('id')),

Dynamically loading custom posts by category with AJAX

I'm working on this site:
http://www.bajo.co.uk/2012/
...which shows a toy portfolio on the home page. The toys have different categories: Infant, Vehicles, educational etc. When the user clicks the sidebar menu 'Infant', thumbnails for all toys with the category 'Infant' will be listed on the right.
I currently have this set up by using a different page-template for each category with the following custom loop:
<!-- loop to show products list -->
<?php
$args = array(
'post_type' => 'products',
'orderby' => 'title',
'order' => 'DES',
'posts_per_page' => 8,
'paged' => get_query_var ('page'),
'post_parent' => $parent,
'category_name' => 'educational'
);
?>
<?php query_posts($args); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<li>
<a href="<?php the_permalink() ?>" class="product_image">
<?php echo get_post_meta($post->ID, 'ProductImage', true);?>
<span class="overlay"></span>
</a>
<h3 class="product_tit"><?php the_title();?></h3>
</li>
<?php endwhile; ?>
<?php else :?>
<p>There are no products to display</p>
<?php endif; ?>
Although this works correctly, every time the user selects a category from the menu, the page is refreshed.
I would like to implement this with AJAX so that the page does not refresh and the products (which are a custom post type) are loaded in dynamically whilst maintaining the pagination.
Any pointers on where to start greatly appreciated.
I'm using:
Wordpress 3.5.1
Custom Post Type UI plugin
I still don't have the right to comment, so I put my comment here as an answer maybe it will be helpful.
My approach for such situation is to create a php file file.php which I will address via a parametrer like this file.php?p=infant (fo example)
<?php
$p=$_GET['p'];
require('../../../wp-load.php');
?>
<?php
$my_query = new WP_Query();
$my_query->query(array( 'post__in' => array($p)));
if ($my_query->have_posts()) : while ($my_query->have_posts()) : $my_query->the_post();
?>
<li>
<a href="<?php the_permalink() ?>" class="product_image">
<?php echo get_post_meta($post->ID, 'ProductImage', true);?>
<span class="overlay"></span>
</a>
<h3 class="product_tit"><?php the_title();?></h3>
</li>
<?php
endwhile;
endif;
?>
I will create in addition a javascript function which will manage the ajax call like this:
function f(str)
{
$.ajax({
cache: true,
type: "GET",
timeout: 5000,
url: 'url/to/file.php?p='+str,
success: function(msg)
{
$('#the_div_containing_li').html(msg);
},
error: function(msg)
{
alert("Your browser broke!");
return false;
}
});
}
Note that you should put your li (and the dynamically loaded content in a div , which I called the_div_containing_li). and onClick on your anchor, call the javascript function f(id of this anchor). you can of course assign to each anchor an id via the wordpress loop.

can't use multiple ajaxLink for loading CJuiDialog widget

I have a problem when using multiple ajaxLink for loading CJuiDialog widget in yii. I'm using multiple dropdowns, each dropdown's value determine next dropdown.
Here is my code for viewing first dropdown and a link to create new item using Cdialog widget.
<?php $cs = Yii::app()->getClientScript();
$cs->registerCoreScript("jquery");
?>
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'enableAjaxValidation'=>false,
)); ?>
<div class="row">
<?php
echo $form->labelEx($model,'uname'); ?>
<?php echo $form->dropDownList($model,'uname',$model- >getUniversityList(),array('onchange'=>'getSchemes(this.value)','empty'=>'Select university')); ?>
<?php echo $form->error($model,'uname'); ?>
<?php //create university dialoge box
if(!Yii::app()->user->isGuest)
{
echo CHtml::ajaxLink('create new university',array('university/dialoge'),array(
'success'=>'js:function(data){
$("#createUniversity").dialog("open");
document.getElementById("create_university").innerHTML=data;
}'));
$this->beginWidget('zii.widgets.jui.CJuiDialog',array(
'id'=>'createUniversity',
'options'=>array(
'title'=>'Create University',
'autoOpen'=>false,
'modal'=>'true',
'width'=>'auto',
'height'=>'auto',
),
));
echo "<div id='create_university'></div>";
$this->endWidget('zii.widgets.jui.CJuiDialog');
}
?>
<div id="scheme">
</div>
</div>
<?php $this->endWidget(); ?>
</div>
<input type="hidden" id="url" value="<?php echo $this->createUrl('scheme/test'); ?>">
this works pretty good.
here is the javascript code for loading next dropdown in the same view file
<script type="text/javascript">
function getSchemes(uid)
{
if(uid==""){
document.getElementById("scheme").innerHTML='';
return;
}
jQuery(function($){
var url=document.getElementById("url").value;
$.post(url, { uid:uid },
function(data){
document.getElementById("scheme").innerHTML=data;
document.getElementById("scheme_link").style.display="block";
});
});
}
The scheme drop down is loaded as the scheme view code is
<?php $cs = Yii::app()->getClientScript();
$cs->registerCoreScript("jquery");
?>
<?php
echo "<div class=".'label'."><label for=".'sch'.">Scheme</label></div>";
echo "<select id=".'sch'." onchange='getDepartments(this.value);'>";
echo "<option value=".''.">"."Select Scheme</option>";
foreach($schemes as $s)
{
echo "<option value='".$s->schemeid."' >".$s->scheme_name."</option>";
}
echo "</select>";
?>
<?php
if(!Yii::app()->user->isGuest)
{
echo CHtml::ajaxLink('create new Scheme',array('scheme/dialoge','id'=>5),array(
'success'=>'js:function(data1){
$("#createScheme").dialog("open");
document.getElementById("create_scheme").innerHTML=data;
}'));?>
<?php
$this->beginWidget('zii.widgets.jui.CJuiDialog',array(
'id'=>'createScheme',
'options'=>array(
'title'=>'Create Scheme',
'autoOpen'=>false,
'modal'=>'true',
'width'=>'auto',
'height'=>'auto',
),
));
echo "<div id='create_scheme'></div>";
$this->endWidget('zii.widgets.jui.CJuiDialog');
}
?>
<div id="department">
</div>
<input type="hidden" id="urldepart" value="<?php echo $this->createUrl('department/test'); ?> ">
the second ajaxLink is shown as create new scheme but on clicking the link it shows the old create university dialog box instead of create scheme.
The simplest solution for this is to create the ID of the element that is causing problems as random.
Try adding:
'id' => 'some-element'.uniqid() // avoid mutliple ajax request because of using live
in the $htmlOptions array of ajaxLink

Resources