xeonz

I have a post that is under review but got it working. One issue I got when open WebApp from iOS first time is breaked network connection. I don’t know why.

I was now also added splash-screen but it does not work:

was added images and this code:

add_action('wp_head', 'ekoqrd_splashscreen');
function ekoqrd_splashscreen(){
?>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphone5_splash.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphone6_splash.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphoneplus_splash.png" media="(device-width: 621px) and (device-height: 1104px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphonex_splash.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphonexr_splash.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/iphonexsmax_splash.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/ipad_splash.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/ipadpro1_splash.png" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/ipadpro3_splash.png" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="https://___.io/wp-content/plugins/ecocard/splashscreens/ipadpro2_splash.png" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<?php
};

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

Thank you, Weston! This seems to work with the extra plugin! Now I just wondering if I can take my base64 image to generate an icon? I’m also going to look on how to get a startup animation because now the page is just white when opening “the app”.

I was just yesterday trying to generate a manifest with javascript and PHP but your solution is much easier/ better. I also got stuck on how to generate the JSON file before I was go to sleep. hehe

Just for curiosa, I send my code, maby can be useful for someone ??

// php webmanifest <link rel="manifest" id="my-manifest-placeholder">
function ECOCARD_manifest( $post_id ) {
    $post_type = get_post_type($post_id);

$siteName = $vpost->post_title;
$name = $_POST['company'];
$pageDescription = $_POST['company'];
$urlcard = $vpost->post_name;

$manifest = [
    "name" => $siteName,
    "gcm_user_visible_only" => true,
    "short_name" => $name,
    "description" => $pageDescription,
    "start_url" => ".https://mysite__.com/abc/".$urlcard."\n",
    "display" => "fullscreen",
    "orientation" => "portrait",
    "background_color" => "#000000",
    "theme_color" => "#000000",
    "icons" => [
        "src" => "https://mysite__.com/wp-content/uploads/2019/11/cropped-maskable_icon_x512-1-1.png",
        "sizes"=> "96x96 128x128 144x144 512x512",
        "type" => "image/png"
    ],
    "src" => "https://mysite__.com/wp-content/uploads/2019/11/cropped-maskable_icon_x512-1-1.png",
    "sizes" => "48x48 72x72",
    "type" => "image/png"
];

$json = json_encode($manifest);
$bytes = file_put_contents("manifest.json", $json); 

header('Content-Type: application/json');
echo json_encode($manifest);
}

function manifesdtmeta_metadata() {

    // Post object if needed
    // global $post;

    // Page conditional if needed
    // if( is_page() ){}
    ?>
    <link rel="manifest" href="<?php echo $SITE_URL;?>/manifest.json">
    <?php
}
add_action( 'wp_head', 'manifesdtmeta_metadata' );

// Added code for change WebAppMainfest for current url 
/* MANIFEST FILTERS
add_filter( 'web_app_manifest', function( $manifest ) {
    global $wp;
    $vpost = get_post($post_id);
    $urlcard = $vpost->post_name;
    $current_url =  home_url( $wp->request );
    $manifest['start_url'] = home_url( '/a/' ) .$urlcard;
    return $manifest;
} );
END MANIFEST*/

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

URL was only for example. I need them all to be the starturl. If user standing on https://ekoqrd.io/a/vg this should also be the app starturl. But when installning the SPWA app then starturl https://ekoqrd.io/ is not dynamic like I need.

Here are correct URL on 2 different starturl

https://ekoqrd.io/a/vg

https://ekoqrd.io/a/rullgrasnu

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

Hi,

Ok, I installed app and added code. But how do I change so app gets current URL as start URL based on where on the site the user adds the APP to home screen?

Can I do something like this:

add_filter( 'web_app_manifest', function( $manifest ) {
    $manifest['start_url'] = current_url( '/?source=homescreen' );
    return $manifest;
} );

or if this not work many something like this:?

add_filter( 'web_app_manifest', function( $manifest ) {
    global $wp;
    $manifest['start_url'] = home_url(add_query_arg(array(), $wp->request)( '/?source=homescreen' ));
    return $manifest;
} );

Or this but it does not work because it does not seams to write out $urlcard:

add_filter( 'web_app_manifest', function( $manifest ) {
    global $wp;
    $vpost = get_post($post_id);
    $urlcard = $vpost->post_name;
    $current_url =  home_url( $wp->request );
    $manifest['start_url'] = home_url( '/a/'.$urlcard."\n" ) ;
    return $manifest;
} );

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

Hi,

Now I think I got it to work, one problem with looping redirect was also the mapping plugin I was installed before, I removed this and added below code + Origins code in htcaccess:

$allowed_hosts = array('hi.3__.se', 'foo.newsubexample.com');
if (strpos($_SERVER['HTTP_HOST']) || !in_array($_SERVER['HTTP_HOST'], $allowed_hosts)!== false) {
	define('LSWCP_PLUGIN_URL', 'https://hi.3__.se/wp-content/plugins/litespeed-cache/');
}

Update: Now I have removed code in htcacess and it works with only the code in wp-config.

Now all my original site works from hi.3__.se . Can I block so only the URL I choose works on the subsite? For example, if I want only hi.3__.se/abc* to work and the rest redirects to the original site home https:://eko___.io/ .

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

Now I have deactivated Origin htcaccess fix so the layout is broken in subsite with error message in Chrome console.

This is the <strong>main site (working)</strong>: https://ek____.io/a/viktor-grahn/

And this is my subsite/ mirror site I added with Domain alias in eko___.io Webhosting + Domain mapping plugin in WP:

https://hi.3on.se/a/viktor-grahn/ (I can remove URL after you seen this)

Can I somehow get Guest Cache to work on subURL or how can I disable “Guest Cache” only on other Origin domains?

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

Hi,

I was trying to add this:

<IfModule mod_headers.c>
SetEnvIf Origin ^(https?://(?:.+\.)?mysite\.com(?::\d{1,5})?)$   CORS_ALLOW_ORIGIN=$1
Header append Access-Control-Allow-Origin  %{CORS_ALLOW_ORIGIN}e   env=CORS_ALLOW_ORIGIN
Header merge  Vary "Origin"
Header set Cache-Control "max-age=0, no-cache, must-revalidate"
</IfModule>

Still the same issue.

I was found the issue but still Guest mode caching is making a big improvement on site so it good if it’s possible to get this to work.

Access to fetch at ‘https://mysite.io/wp-content/plugins/litespeed-cache/guest.vary.php’ from origin ‘https://my.newsuburl.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

Adding this but then I get a redirect loop:

# START ALLOW OTHER ORGINS
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin https://my.newsuburl.com
Header set Access-Control-Allow-Credentials true
</IfModule>
# END ALLOW OTHER ORGINS

Any idea?

Hi to myself!

I think I found the issue, I was turned off Guest mode caching.

Thank you! I going to check images on the site!

Im going to order pro version.

You can check my “ROI” Calculator at firstpage on [URL removed by moderator: please don’t spam] (to moderator: its not spam) ROI Calculator in right side of front page

Mod sec was of, maby some other issue not related to this plugin.

Thx! I do order now!

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by Steven Stern (sterndata).
• This reply was modified 3 years, 1 month ago by xeonz.

Hi,

Thx for the fast replay.

I was found out it was Rocket loader from Cloudflare that was the issue.

Thank you!

• This reply was modified 3 years, 1 month ago by xeonz.
• This reply was modified 3 years, 1 month ago by xeonz.

I need WP Bakery and also Elementor support. Working now? I have Polylang with Deepl and Lingotek but this does not work

I verified the issue and when using elementor template builder this break the iframe for Stripe Direct Pay (Apple Pay/ Google Pay etc)

Hi,

I think this will remove Apple pay, Google Pay etc. Any other solution to this. Maby an css issue with wrapper when you not using default WooCommerce elementor template. I tried to change to custom template and then I get same issue.

Cheers Viktor