Change button title with css - css

Good morning, Im sure im missing something obvious but I am struggling finding the correct CSS to change the button text on this page
http://www.inksharks.com/store/cart/
I want to change the text from "continue shopping" to Add to Order.
Thanks in advance!

It isn't in the CSS, rather it's in the HTML.
Here is the markup - it is in an a tag. Inside of <div id="content" class="content clearfix">
Continue Shopping
Here is a modified version to include "Add to order":
Add to order
Note, the title attribute should be changed to match it - as #Andrew pointed out in the comments.

This is an HTML issue. The line of code you need to modify is:
<a class="Cart66ButtonSecondary" title="Continue Shopping" href="http://www.inksharks.com">Continue Shopping</a>

Related

I want to replace text in my WordPress site

Kindly look at this this here you can see here is mentioned (8 left) i want to replace (left with places left) means in simple i want to show 8 places left…
https://digitalrise.website/product/kayak-lisbon/?date=2022-11-07
Here is link below
you can try this-
<div class="text-align: left">
<span>8 Left</span>
</div>
Please try this code, if you still facing issue just lemme know, i will help you more.
Thanks
In your HTML code for that page, find the following code:
<small class="spaces-left">8 left</small>
It is contained inside this class: <div class="form-field form-field-wide">
Change the part of that HTML that says "8 left" and change it to what you wish the page to display.
For example: <small class="spaces-left">Places Left: 8</small>

How do I wrap a label in a div within a class to modify it?

I'm looking for the method to put a label and text in a div, within a class.
I have this html:
<div class="awpcp-subtitle">Contact Information</div>
<a href="https://adsler.co.uk/wp-user-test-dashboard-
2/awpcp-reply-to-ad/13/madame-bovary/">Contact
Anonymous</a>
<br/><label>Phone:</label> 7576XXXXXX
<br/><label>Location:</label> London, UK
</div>
<div class="showawpcpadpage"><label>Price:</label>
<strong>£ 3.00</strong></div>
<div class="fixfloat"></div>
I want to put the label 'phone' within a div class and, if necessary, the text after it in a div class.
Basically the aim of this is to be able to select the label 'phone' and the text after it, and give it a background color.
I don't know where I would insert it in given html, or even what it would lool like?
Im guessing somewhere after 'Anonymous,'
so:
Anonymous</a> div class="Phone:"><label>Phone:>.
</label>
and then continuing with existing code:
<br/>label><Phone:></label>7576XXXXXX
<br/>..........
First of all, I would suggest you go through some basics of HTML. This would be a good start: https://www.w3schools.com/html/
Now coming back to your question, you could enclose it like this:
<div class="awpcp-subtitle">Contact Information</div>
<a href="https://adsler.co.uk/wp-user-test-dashboard-
2/awpcp-reply-to-ad/13/madame-bovary/">Contact
Anonymous</a>
<div class="phone"><label>Phone:</label> 7576XXXXXX</div>
<div class="location"><label>Location:</label> London, UK</div>
</div>
<div class="showawpcpadpage"><label>Price:</label>
<strong>£ 3.00</strong></div>
<div class="fixfloat"></div>
Here, I have removed the <br> because you were using it to make that Phone and Location display in separate lines. Since we are using <div> tags are block level element by default, the contents of it will be displayed in separate lines.
So, now you can change the color of those two boxes like this:
.phone{
background-color: red;
}
.location{
background-color: yellow;
}
And lastly you asked about how to do this in Wordpress. As you may already know Wordpress uses Themes, you have to check which one is your current theme (the one that is running in your website). This can be checked via visiting Wordpress Admin Panel --> Appearance --> Themes. You will see the current active theme's name in that page. Now you have to use an FTP Client or the File Manager in your cPanel to access the following the location: /wp-content/themes/yourthemename/ in your server. Here, youthemename is the name of the theme that you noticed in the previous step.
Once you are in that folder, you would see a bunch on template files. I would suggest taking a close look at each file if you are unsure. Or its better you get a basic idea of Wordpress first before editing it. Take a look at this: https://developer.wordpress.org/themes/basics/template-hierarchy/
Once you find out the template file has this HTML code you wanted to edit, simply open it and make the changes and save it. You are all done. If you are using any Cache plugins in your Wordpress, you might need to purge the cache if you don't see the changes when accessing the webpage.
That being said, my writeup might give you a small confusion. That's why I suggested to have a look at the basics first. Otherwise you have to hire someone who would be ready to do that specific changes for you.
Hope it helps.

get image TV on homepage modx revolution

I have a lot of sub pages and latest 3 I am showing at homepage, I could display only title but image can't(every sub page has TV named 'image_prew' and I am trying to get value of this TV for image), here is my code:
<div class="cat">
<div class="role">
<h1 class="[[+pagetitle]]">[[+pagetitle]]</h1>
</div>
<div class="menu_prew-[[+pagetitle]]">
<img src="[[*image_prew]]" class="image"/>
</div>
<div class="clear"></div>
</div>
You don't say how you're fetching the sub-pages, but if you're using getResources you need to use the parameter &includeTVs=1.
And as Sean mentions above, in a template chunk TVs are placed in a placeholder tag -- use a plus sign not an asterisk.
try [[+tv.image_prew]] and check the documentation near the bottom "Displaying Template Variables with getResources" is clearly labelled
What is your output setting on the TV? Whenever you are outputting image source urls in your TVs, make sure in your output setting tab the output is set to "text". You want the text to render to your html tag. Default may or may not work depending on your input type setting, so I always force this to "text". I have had that issue once or twice;).

How to make link in header using meteoric

I need to make a link to another page in Meteor using Meteoric package. I'm trying to add it to the right of the header with a button. If I create a button in {{#contentFor "headerButtonRight"}} - it aligns as expected. But if I add a tag - alignment is no longer applied. I tried putting the element to "headerTitle" and add class "pull-right" but results are the same. Currently my code looks like this:
{{#contentFor "headerButtonRight"}}
<button class="button button-clear pull-right">{{> ionIcon icon="ios-barcode"}} Scan</button>
{{/contentFor}}
If this is not the correct way to put a link button to the right of the header - what is?
Thank You in advance.
You probably don't need the button nested inside the link tage try...
{{#contentFor "headerButtonRight"}}
{{> ionIcon icon="ios-barcode"}} Scan
{{/contentFor}}

Creating Valid XHTML Clickable Block Region

I'm trying to make a "clickable" region.
<a
style="display: block"
href="http://stackoverflow.com">
StackOverflow
</a>
A is an inline element but the CSS made it a block.
If the above is valid, then the following should be valid too:
<a
style="display: block"
href="http://stackoverflow.com">
<div>Some DIV that links to StackOverflow</div>
</a>
But validator.w3.org shouldn't be flagging it as invalid (which it is right now).
If it is invalid, what would be the most proper way to make a block element "clickable" and redirects to an arbitrary page. I'm aware I can use JS onclick to achieve this behaviour, but how will Google see this?
The validator is correct - you can't put <div> inside <a>, no matter what you do afterwards with CSS.
The proper thing to do is what you did in your first code block - <a style="display: block;">
If you want something inside that you can do <a style="display: block;"><span style="display: block;">
Don't confuse valid HTML with valid CSS. It is valid to use the display css property to make inline elements block. It is not valid to put block HTML elements within inline ones.
It doesn't follow that the one being valid implies the other has to be. There are nesting rules for HTML, and div-within-anchor doesn't fit them, which is why validator.w3.org is giving you a hard time.
If you truly must have a div, rather than text, images or <span style="display: block">s, that's clickable, then yes, you will have to use an onclick event. Google will not understand or acknowledge the existence of the link. (You may be able to cope with this by having an anchor on something that anchors can apply to, in addition to the onclick div.)
Something I've done in the past with this sort of problem is invoke the click on the parent element (My example uses jQuery):
<div class="link">
Visit Google
</div>
$(".link").click(function(){
document.location = $(this).find("a:first").attr("href");
});
With styles you could make the entire area appear to be the link by setting the cursor, a roll-over state, etc.
First you need to know whether you want to use strict or transitional XHTML (frameset is not useful here). Then you look into the DTD (link) and you'll see that A cannot have a DIV inside.
Why don't you use an area tag for this? It is supposed to define the clickable area in an imagemap.
Google bots now follow simple javascript links, so using JS on the onClick event of your div is an option. Other search engine bots don't do that, but sooner or later they will.
More info in this article.

Resources