I am creating a menu for an Indian restaurant, The Curry Lounge. I want to show the vegetarian symbol next to the title (as shown) if it is actually a vegetarian dish.
I have tried to look for a way to do this in custom fields but have had no luck in doing so. I have created a custom field within one of my posts and called it "hass_veg" and in the menu_page_template of my theme I have the following code where I want it to be placed:
<?php if ( $hass_veg <> 'Y' ) { ?>
<img src="http://www.tesco.com/wine/UIAssets/I/Sites/Retail/Wine/Online/Product/IsVegetarian.gif" alt="Vegetarian" height="30" width="30">
<?php } ?>
I have deduced that when I put the "Y" in, the image appears on the page.
Can anyone help me at all?
In your stylesheet:
.cufon-canvas{
background: url('path_to_your_image_goes_here');
}
Or whatever class name you choose to give the div next to the vegetarian items. I'd add the image in the stylesheet so you (and others) don't have to dig through the php to change it.
Related
Right now my featured image for a page template is pulled from the standard Featured Image option on the right side of the new page.
I have my CSS in my stylesheet that says object-fit: cover since it's an absolute image instead of a background image
Each image is positioned a little differently and what i'd like to do is make it so that i can set a specific object-position: x x for each image.
So, for one image, if it's cutting off someones head, i could change it to object-position: center bottom; for example or vice versa.
Does anyone know the best way of doing this ? Any way for some plugin that would allow me to dictate lets say 3 options based off a drop down from the backend of WP like:
Background:
Option 1: center top
Option 2: center
Option 3: center bottom
And then in the CSS i could set a class that would correspond to those? This way each featured image doesn't need to be one way.
Thanks!
You should implement a custom meta field (a plugin like ACF or CMB2 is the easiest solution) and then use its value on the frontend.
<?php
if (has_post_thumbnail()) {
$post_id = get_the_ID();
$custom_class = get_post_meta($post_id, 'my_custom_image_class', true);
// ACF example
// $custom_class = get_field('my_custom_image_class', $post_id);
the_post_thumbnail('post-thumbnail', ['class' => $custom_class]);
}
Rather than adding another plugin (though Pods or ACF would be the easiest route), you could do this relatively simply by leveraging WP built-in features.
1. First enable custom fields in your post edit screen
Hit the three dots in the top-right; then go to Preferences, then enable Custom fields.
2. Add a custom field at the bottom of the post edit screen.
Give your custom field a name (say, "photo-style") and then its value is a single class name that you can switch out depending on needs, e.g. "photo-center", "photo-top", etc.
3. In Admin -> Tools -> Theme File Editor add the following to your Theme Functions file
add_filter( 'body_class', function( $classes ) {
$my_post = get_the_ID();
$new_class = get_post_meta($my_post, 'photo-style', true);
if($new_class !== "false") {
return array_merge( $classes, array( $new_class ) );
}
return $classes;
} );
4. Now, when you load your post, you can open page inspector and see the page body has your new class name ("photo-center, etc.") added.
Then you can make whatever CSS changes you need to in customizer and you're set.
The only drag is that you'll need to remember to add the custom field every time. Maybe not a major issue if it's a site you'll be managing yourself, but were it for a customer I'd think about a more easy-to-manage solution.
UPDATE. If you're using ACF
Ignore steps 1 and 2 above. Go to Custom Fields in admin. Add a new field group, setting it to display on posts/pages etc as you need.
Make it a select, with the options you want (center, center-top, etc.) and set its name to "photo-style". Edit one of your posts and select the right photo styling from the new dropdown.
Steps 3 and 4 are the same as above. Add the new function then style with css. If you check dev tools you'll see that body now has the class you selected from your drop-down list on it. You could then do something like:
body.center-top .wp-featured-image {
object-fit:top;
}
body.center .wp-featured-image {
object-fit:center;
}
I have php code which generates readmore link. I need to add css style="border-bottom: 1px solid #000000;padding:20px;"
but don't know how. Any help with that:
if ( preg_match("/GN_readmore/", $html) && $link ) {
$gn_readmore = JHTML::_('link', $link, JText::_('MOD_GLOBALNEWS_READ_MORE_TITLE'));
}
Can you copy/paste the html output code? We may find an attribute to style. It's what #04FS is describing.
Example:
If "read more" is a title attribute, you can style it using the CSS2 [attribute~=value] selector where your attribute is "title" and the value is "read more". Be sure the title is exactly how it's shown in your html.
https://www.w3schools.com/cssref/sel_attribute_value_contains.asp
Sometimes you only want to style the "read more" on one page without affecting all pages. So, assign a css name to the page through the menu manager (on that menu item). If it's not a menu item on your primary navbar, then create a new (hidden) menu. A hidden men is very handy because you can have internal links with the flexibility to change that menu item another time; it then updates all internal links throughout the site like your main menu does.
Situation: PHP-based CMS (OpenCart 2.0.3.1) -> category page -> outputs the product names via:
<?php echo $product['name']; ?>
Problem: need to wrap a portion of the product name, to the next line. For example, what currently displays as 20-inch Blue Widget For Golfers should display as
20-inch Blue
Widget for Golfers
So every product that has the word "Widget" (or "AnotherKeyword" in it), should have a <br> before it.
How can this be done?
P.S. Changing the product name itself to include a <br> or <br> doesn't work, since OpenCart displays whatever is in the Product Name field literally, ignoring HTML. (Unless someone can point me in the direction of "how to echo the $product[name] but actually process the HTML in it").
As suggested, you can first replace in php "Widget" with a br in front and then via jquery wrap all this way:
<script>
$(".name a").text(function () {
$(this).wrap('<pre />');
})
</script>
I want only those filters to appear which has some products in it., for example if tops has only size L and M, then i want to display only L AND M filter option in size. same goes with other filters like category , brand name also. only those brand names which has products in it should be displayed. I want to write a php script for it. I am working on an android application which has magento back end.
In Admin menu, open Catalog > Attributes > Manage Attributes. Find the attribute you want to show only with results and click on the row. In the form opened, scroll down for Frontend Properties tab change the value Use In Layered Navigation to Filterable (with results).
Updated answer;
If you want don't want to change your attribute use in layered navigation to Filterable (with results) and filter only in a theme you need to make a couple edits on your template files.
In catalog/layer/filter.phtml remove the "else" section like below:
<?php else: ?>
<span>
<?php echo $_item->getLabel(); ?>
<?php if ($this->shouldDisplayProductCount()): ?>
<span class="count">(<?php echo $_item->getCount() ?>)</span>
<?php endif; ?>
</span>
In configurableswatches/catalog/layer/filter.phtml add a line after $_hasItems = ($_item->getCount() > 0); like below:
$_hasItems = ($_item->getCount() > 0);
if(!$_hasItems) continue;
I'm using the latest wp version. When I go to edit a category to add descriptions specifically for each category, there is a note that says, "The description is not prominent by default, however some themes may show it."
My theme does not show it. What code do I need to make this visible/prominent? And where would I insert it?
You're looking for category_description().
<?php echo category_description(); ?>
As for where to add it, that's way too broad of a question. We would have no way of knowing without looking at your theme template system.
To display the category, we want to echo it:
<?php echo category_description();?>
And you would basically treat this as if it is text (because that's what it outputs).
So lets say you have a <div> that you want it displayed within in your theme....
<div class="your-container">
<?php echo category_description();?>
</div>
And there ya have it!
Wordpress Codex:
https://codex.wordpress.org/Function_Reference/category_description