Page 1 of 1
Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 9:22 am
by Chizzle685
Page Properties ---> Icons - It is possible to insert 16x16, 32x32, 64x64 icons. But is there also a possibility for 192x192 for the Chrome browser?
Here is the article on it
https://developers.google.com/web/updat ... or-Android
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 10:26 am
by Pablo
There is no standard option for this but of course you can add it manually via page HTML.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 11:43 am
by Chizzle685
hm... i out this:
<link href="Logo-Google-192.png" rel="icon" sizes="192x192" type="image/png">
inside<body>tag, but it does not work.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 11:55 am
by zinc
Chizzle685 wrote: ↑Thu Aug 26, 2021 11:43 am
hm... i out this:
<link href="Logo-Google-192.png" rel="icon" sizes="192x192" type="image/png">
inside<body>tag, but it does not work.
How about trying this:
<link rel="icon" sizes="192x192" href="android-chrome-192x192.png">
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 11:57 am
by zinc
Chizzle685 wrote: ↑Thu Aug 26, 2021 11:43 am
hm... i out this:
<link href="Logo-Google-192.png" rel="icon" sizes="192x192" type="image/png">
inside<body>tag, but it does not work.
Not body tag, it should be <head> tag.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:12 pm
by Chizzle685
Thank you for your answer. If I do it between head tags, the privacy pop-up no longer works.
the following appears in the browser: $ (document) .ready (function () {if (document.cookie.indexOf ("privacynotice = true") <0) = "" {= "" $ ("# privacyPopup"). modal ( "show"); = ""} = "" $ ("# privacyCheckBox"). change (function = "" () = "" = "" {= "" document.cookie = "privacynotice = true; expires = Fri , 31 Dec 9999 23:59:59 GMT; path = / "; =" "=" "$ (" # privacyPopup "). Modal (" hide "); =" "}); =" "script =" " >
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:20 pm
by zinc
Chizzle685 wrote: ↑Thu Aug 26, 2021 12:12 pm
Thank you for your answer. If I do it between head tags, the privacy pop-up no longer works.
the following appears in the browser: $ (document) .ready (function () {if (document.cookie.indexOf ("privacynotice = true") <0) = "" {= "" $ ("# privacyPopup"). modal ( "show"); = ""} = "" $ ("# privacyCheckBox"). change (function = "" () = "" = "" {= "" document.cookie = "privacynotice = true; expires = Fri , 31 Dec 9999 23:59:59 GMT; path = / "; =" "=" "$ (" # privacyPopup "). Modal (" hide "); =" "}); =" "script =" " >
In that case why dont you add the icons that WWB lets you add and simply copy the line from it and paste it and change the icon size and also make sure the file is also present in the "Images" folder.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:26 pm
by Pablo
Note that we cannot give support on custom code.
But, if the code you have added does not work then:
- make sure the code is valid. For example, the closing tag is missing.
- make sure the code does not conflict with other code on the page
- make sure the code was inserted in the correct part of the page
- code should never be inserted inside the body tag, this section is for attributes only!
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:51 pm
by crispy68
If adding the code Zinc provided to your head tag messes up your privacy pop-up, then it means you have issues with the privacy pop-up code like Pablo is referring to. There is either errors in the code or it is in the wrong place.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:54 pm
by Chizzle685
thx pablo and zinc. but it doesn't work for me
. All I want is that an icon is displayed in the browser's bookmark.
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 12:59 pm
by Chizzle685
@ crispy68. I got my privacy pop-up from a template from web builder.
HTML Properties -> Type: Between <head> </head> tags
<script>
$(document).ready(function ()
{
if (document.cookie.indexOf("privacynotice=true")<0)
{
$("#privacyPopup").modal("show");
}
$("#privacyCheckBox").change(function ()
{
document.cookie = "privacynotice=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
$("#privacyPopup").modal("hide");
});
});
</script>
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 1:21 pm
by crispy68
Have you added any other code anywhere else? Do you have a link to the page?
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 1:36 pm
by Chizzle685
here is the link for the page
https://jahncke-gmbh.de. I only added the following meta tag: <meta name = "theme-color" content = "# FF0000" />
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 1:46 pm
by Pablo
It looks like the start of the script tag is missing:
<script>
Re: Icon 192x192px for Chrome
Posted: Thu Aug 26, 2021 2:31 pm
by crispy68
@Pablo, I see the <script> tag, it appears on the line before (unless it was recently updated).
this code:
Code: Select all
<link href="Logo-Google-32.png" rel="icon" sizes="32x32" type="image/png">
should be in the <head> section. Looking at your code all of these are right before the javascripts at the end of the page before the end body tag </body>.
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 6:56 am
by Chizzle685
@pablo and crispy68. I can't get the code into the head section
I have now created an empty project. When I go to Page Properties -> Icons -> insert 16x16; 32x32; 64x64. The code is still in the body:
<!doctype html><html><head><meta charset="utf-8"><title>Untitled Page</title><meta name="generator" content="WYSIWYG Web Builder 16 - https://www.wysiwygwebbuilder.com"><meta name="viewport" content="width=device-width, initial-scale=1.0"><style>body{background-color:#FFFFFF;color:#000000;font-family:Arial;font-weight:normal;font-size:13px;line-height:1.1875;margin:0;padding:0;}a{color:#0000FF;text-decoration:underline;}a:visited{color:#800080;}a:active{color:#FF0000;}a:hover{color:#0000FF;text-decoration:underline;}input:focus,textarea:focus,select:focus{outline:none;}</style><style>#wb_Text1{background-color:transparent;background-image:none;border:0px solid #000000;padding:0;margin:0;text-align:left;}#wb_Text1 div{text-align:left;}#wb_Text1{display:block;margin:0;box-sizing:border-box;width:100%;}#wb_LayoutGrid1{clear:both;position:relative;table-layout:fixed;display:table;text-align:center;width:100%;background-color:transparent;background-image:none;border:0px solid #CCCCCC;box-sizing:border-box;margin:0;}#LayoutGrid1{box-sizing:border-box;padding:0px 15px 0px 15px;margin-right:auto;margin-left:auto;}#LayoutGrid1 > .row{margin-right:-15px;margin-left:-15px;}#LayoutGrid1 > .row > .col-1,#LayoutGrid1 > .row > .col-2{box-sizing:border-box;font-size:0px;min-height:1px;padding-right:15px;padding-left:15px;position:relative;}#LayoutGrid1 > .row > .col-1,#LayoutGrid1 > .row > .col-2{float:left;}#LayoutGrid1 > .row > .col-1{background-color:transparent;background-image:none;border:0px solid #FFFFFF;width:50%;text-align:left;}#LayoutGrid1 > .row > .col-2{background-color:transparent;background-image:none;border:0px solid #FFFFFF;width:50%;text-align:left;}#LayoutGrid1:before,#LayoutGrid1:after,#LayoutGrid1 .row:before,#LayoutGrid1 .row:after{display:table;content:" ";}#LayoutGrid1:after,#LayoutGrid1 .row:after{clear:both;}@media (max-width: 480px){#LayoutGrid1 > .row > .col-1,#LayoutGrid1 > .row > .col-2{float:none;width:100% !important;}}#wb_uid0{color:#000000;font-family:"Arial";font-size:13px;}</style></head><body><div id="wb_LayoutGrid1"><div id="LayoutGrid1"><div class="row"><div class="col-1"><div id="wb_Text1"><span id="wb_uid0">test</span></div></div><div class="col-2"></div></div></div></div><link href="Logo-Google-16.png" rel="icon" sizes="16x16" type="image/png"><link href="Logo-Google-32.png" rel="icon" sizes="32x32" type="image/png"><link href="Logo-Google-64.png" rel="icon" sizes="64x64" type="image/png"><link href="css/Untitled1.css?v=0" rel="stylesheet"></body></html>
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 7:41 am
by Pablo
Tip: disable HTML formatting (minify) when you are in development, then you will have a better overview of the code.
If you need further assidstance then please share a demo project.
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 8:31 am
by Chizzle685
Here is my demo Project. The Icons are in "frame-Kontakt". it would be great if the icons appeared next to the bookmarks in the browser
http://doppelhäuser.info/jahncke-demo.rar
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 9:23 am
by Pablo
I cannot find the code, where exactly did you add it?
Please read this before sharing a project:
http://www.wysiwygwebbuilder.com/forum/ ... 10&t=82134
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 9:42 am
by Chizzle685
Hello Pablo, the project is without the user defined code. I created the 16x16, 32x32, 64x64 icons on the "frame-contact" page under Page Proberties ---> Icons.
It doesn't necessarily have to work with the 192x192 icons.
The most important thing for me is that the logo appears under bookmarks in the browser.
My attempt with the code for 192x192 icon can be found under
http://xn--doppelhuser-r8a.info/jahncke ... h-code.rar
The code is in page-html between head under "frame-contact"
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 9:51 am
by Pablo
I think it is related to the HTML formatting. The line you have inserted does not have an end-of-line.
- Open the Page HTML
- Set the cursor after the code
- Press Enter
- Click OK
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 10:06 am
by Chizzle685
the bug with the privacy pop-up has been fixed. But unfortunately it still doesn't work with the bookmarks. This is my Domain for testing xn--
https://doppelhäuser.info/
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 11:42 am
by Pablo
Did you also upload the image?
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 11:55 am
by Chizzle685
yes, it´s in the root
Re: Icon 192x192px for Chrome
Posted: Fri Aug 27, 2021 12:56 pm
by Pablo
The code is correct now.
Note however that you have selected to move code to the end of the page so this may affect the behavior of the icon.
Re: Icon 192x192px for Chrome
Posted: Mon Aug 30, 2021 12:22 pm
by Chizzle685
I disabled the following: Move external CSS style sheets to the end of the page
Now it works, thank you very much