How to encode “?” in image URL - wordpress

I checked this already and found a solution here (Q 34160546) which sadly does not work for me though, maybe anyone else has an idea?
I checked my site on pingdom and wanted to get rid of this problem they put up:
Resources with a “?” in the URL are not cached by some proxy caching servers. Remove the query string and encode the parameters into the URL for the following resources:
A bunch of jpgs are listed, but to keep it simple lets just look at my profile picture on the main homepage (right widget):
https://example.com/profile.jpg?w=192
This ? should be encoded with %3F and my question is how I can do that the best way? Within the widget code that generates the code above, I only included this:
<img src="https://example.com/profile.jpg" class="aligncenter" width="192">
Now I can’t just go ahead and write this instead, it will result in the picture not showing up:
<img src="https://example.com/profile.jpg%3Fw=192">
Can anyone tell me a quick fix for my ~25 images? Maybe it will improve the site speed..

In WordPress, this is possible to remove "?" from script and styles. But from the image, you need some customization.
you can use preg_replace, I did this little example for you.
<?php
$url = "http://www.test/img/FMR.jpg?Qq_0y12h";
echo "url = $url\n\n";
$urlFormatted = preg_replace("/\?.*$/", "", $url);
echo "urlFormatted = $urlFormatted\n";
?>
For more information,
Remove character from image url
PHP Remove parameters from image extension
Removing query string in PHP (sometimes based on referrer)
Or you may try this code also, not tested but this will help you. please visit
function remove_query_string($url) {
return remove_query_arg('w', $url);
}
add_filter('the_permalink', 'remove_query_string');
hope this will helps you.

Related

Pre-existing URLs with /# stop working

I have existing URLs that used the URL hash to provide extra data to javascript after page load, e.g.
http://www.example.com/my/directory/#/foo/bar/
I'm implementing jquery.history for something else, but also need to make those old URLs continue to work (e.g. if someone might have bookmarked it with the /#... part).
However on page load the plugin is stripping out everything between the domain and the /#, e.g. the URL ends up becoming:
http://www.example.com/foo/bar/
This isn't happening in IE 9, but is happening in Firefox and Chrome.
Any ideas? I don't consider this a bug in the plugin, but I'm happy to amend the unminified source files for my own usage, if someone suggests a fix that won't break the rest of its functionality.
One possible idea - I no longer care about what that extra data in the URL after the # is, so could perhaps remove that part from the URL before the history plugin does anything to it. I'm not entirely sure yet at what point that could be, or more specifically when the plugin is amending the URL on page load.
In the end I did what I mentioned at the end of my question. Added this bit of inline JS prior to the call to the history plugin js file:
(function(){
if (document.location.hash.length !== 0) {
document.location.hash = '';
}
})();
At worst we end up with the URL still having a trailing # at the end, but as it doesn't have #/ then the history plugin doesn't then mess it up.

how to block css from external access

Someone had try to steal my css file to use at his site. Can i somehow block CSS file from external access, but not damage my site? Somehow through htaccess or something. Thanks for your advice, any help appreciated.
Generate your css with PHP like style.css.php and in the code accept a token which refreshes every second. Your main page will include it using the current token src="style.css.php?token=abc123". If the token is valid, it serves it up. If the token is expired, it doesn't.
Dumbest solution ever. Endless workarounds, but might help against that guy who wants to steal your CSS. Worth a try and a good laugh.
Step 1: Create a table css_security_force in your database with one column token
Step 2: Create a cron that runs every second to update the token (now THAT's secure):
UPDATE css_security_force SET token = md5( NOW() );
Step 3: In your PHP head grab the token from the css_security_force table and set it as a variable $token then reference that token in the CSS link:
<link rel="stylesheet" href="style.css.php?token=<?=$token?>" />
Step 4: In your style.css.php file, grab the token from the database and check it against the query param.
if ($_GET['token'] == $token) {
echo <<<CSS
body {
background-color : yellow;
color : pink;
}
CSS;
} else {
echo 'Stop stealing my CSS!!!!!!';
}
Sit back and watch your foe's plans crumble before him.
EDIT
I got curious and made a working demo (Took it down after a couple days of 1 second db updates for sanity purposes, but you can easily recreate with the source posted below).
Here is the source on Github
No. This makes no sense. Your CSS file must be available to anyone who can view your site if you want your pages styled.
Who cares if someone uses your style?
Simply put you cannot block it because the browsers have to have access to them. It is just one of those things you should not worry about. If it were possible, many sites like Facebook and Twitter would be blocking it.

Wordpress rewrite css rule

I generate css dynamically using query_vars.
Right now the url of query var is http://example.com/index.php?loadcss=mycss
How can I rewrite those urls into http://example.com/css/mycss.css instead of using query string that cannot cached, it would look better to use something like I wrote above.
I have read about add_rewrite_tag, but have no idea how to use it. Can someone give me direction how to use it?
In the case of wordpress I would just use a PHP to generate the dynamic CSS.
This is the method most people are using .
See HERE or HERE or HERE for example .
You have many ways to do this technique, some of them also show style.css and not style.php on the code (actually it is only about changing header or putting php code inside the css.. )
Could you not use a str_replace() since the url will be the same for each?
$baseURL = 'http://example.com/index.php?loadcss='
$cssURL = 'http://example.com/css/'
str_replace($baseURL . 'mycss', $cssURL . 'mycss.css', $the_queried_vars);
Try out the Redirection WordPress Plugin

Setting A URL Alias is changing the look of the Page

OK I a page that is assigned to node/4 and it looks fine:
The client wants the URL to read Pictorial Availability or something like that. I change the URL Alias and this is what happens:
I know in the content box they have the following:
<?php require_once "custom_app/cart/list_preloader.php"; ?>
I don't think that is the issue because when you use the default route (node/4) it loads fine. I am trying to figure out why it puts a white space between the header and the start of the content. Anybody have any ideas as to why this would happen? I appreciate any input anyone may have.
The screenshots weren't really enough for this. Demos links would help in the future.
When visiting the page using it's URL alias an additional CSS file is loaded (http://goo.gl/x1iKq) that gives #title a larger height, messing up spacing.

Problem passing parameters via Iframe in IE

I'm trying to execute an HTTP GET from my website to another website that is brought in via iframe.
On Firefox, you can see in the source that the correct url is in the iframe src along with it's correct parameters-- and it works.
On IE, you can see in the source that the correct url is in the iframe src along with it's correct parameters-- and it doesn't work...
Is there something about IE that doesn't let you pass parameters through an iframe in the querystring?
I've tried refreshing the iframe in IE, I've tried refreshing my page & the iframe in IE, and I've tried copying the url and re-pasting it into the iframe src (forcing it to refresh as if I just entered it into the address bar for that iframe window). Still no luck!
Anyone know why this is happening, or have any suggestions to try to get around this?
Edit: I cannot give a link to this because the site requires a password and login credentials to both our site and our vendor's site. Even though I could make a test account on our site, it would not do any good for the testing process because I cannot do the same for the vendor site. As for the code, all it's doing is creating the src from the backend code on page load and setting the src attribute from the back end...
//Backend code to set src
mainIframe.Attributes["src"] = srcWeJustCreated;
//Front end iframe code
<iframe id="mainIframe" runat="server" />
Edit: Problem was never solved. Answer auto accepted because the bounty expired. I will re-ask this question with more info and a link to the page when our site is closer to going live.
Thanks,
Matt
By the default security settings in IE query parameters are blocked in Iframes. On the security tab under internet options set your security level to low. If this fixes your problem then you know that is your issue. If the site is for external customers then expecting them to turn down their security settings is probably unreasonable, so you may have to find a work around.
Let's say your site is www.acme.com and the iframe source is at www.myvendor.com.
IIRC, most domain-level security settings don't care about the hostname, so add a DNS CNAME to your zone file for myvendor.acme.com, pointed back to www.myvendor.com. Then, in your IFRAME, set the source using your hostname alias.
Another solution might be to have your Javascript set the src to a redirector script on your own server (and, thus, within your domain). Your script would then simply redirect the IFRAME to the "correct" URL with the same parameters.
If it suits you, you can communicate between sites with fragment identifiers. You can find an article here: http://tagneto.blogspot.com/2006/06/cross-domain-frame-communication-with.html
What BYK said. I think what's happening is you are GETting a URL that is too large for IE to handle. I notice you are trying to send variable named src, which is probably very long, over 4k. I ran into this problem before, and this was my code. Notice the comment about IE. Also notice it causes a problem with Firefox then, which is addressed in another comment.
var autoSaveFrame = window.frames['autosave'];
// try to create a temp form object to submit via post, as sending the browser to a very very long URL causes problems for the server and in IE with GET requests.
var host = document.location.host;
var protocol = document.location.protocol;
// Create a form
var f = autoSaveFrame.document.createElement("form");
// Add it to the document body
autoSaveFrame.document.body.appendChild(f);
// Add action and method attributes
f.action = protocol + '//' + host + "/autosave.php"; // firefox requires a COMPLETE url for some reason! Less a cryptic error results!
f.method = "POST"
var postInput = autoSaveFrame.document.createElement('input');
postInput.type = 'text'
postInput.name = 'post';
postInput.value = post;
f.appendChild(postInput);
//alert(f.elements['post'].value.length);
// Call the form's submit method
f.submit();
Based on Mike's answer, the easiest solution in your case would be to use "parameter hiding" to convert all GET parameters into a single URL.
The most scalable way would be for each 'folder' in the URL to consist of the parameter, then a comma, then the value. For example you would use these URLs in your app:
http://example.com/app/param,value/otherparam,othervalue
http://example.com/app/param,value/thirdparam,value3
Which would be the equivalent of these:
http://example.com/app?param=value&otherparam=othervalue
http://example.com/app?param=value&thirdparam=value3
This is pretty easy on Apache with .htaccess, but it looks like you're using IIS so I'll leave it up to you to research the exact implementation.
EDIT: just came back to this and realised it wouldn't be possible for you to implement the above on a different domain if you don't own it :p However, you can do it server-side like this:
Set up the above parameter-hiding on your own server as a special script (might not be necessary if IE doesn't mind GET from the same server).
In Javascript, build the static-looking URL from the various parameters.
Have the script on your server use the parameters and read the external URL and output it, i.e. get the content server-side. This question may help you with that.
So your iframe URL would be:
http://yoursite.com/app/param,value/otherparam,othervalue
And that page would read and display the URL:
http://externalsite.com/app?param=value&otherparam=othervalue
Try using an indirect method. Create a FORM. Set its action parameter to the base url you want to navigate. Set its method to POST. Set its target to your iframe and then create the necessary parameters as hidden inputs. Finally, submit the form. It should work since it works with POST.

Resources