mango404

hi foxglove,
i found this usefull article (last updated 2019):
https://digwp.com/2009/06/including-jquery-in-wordpress-the-right-way/
It says:

Much has changed with WP script loading since this article was posted. These days, WordPress automatically loads jQuery for you

WordPress itself wrote this:

Updates to jQuery in WordPress take place across three releases 5.5, 5.6, and 5.7. As we reach the mid-point of this process, run the update test plugin to check your sites for errors ahead of time.

If you find issues with the way your site looks ( e.g. a slider doesn’t work, a button is stuck — that sort of thing), install the jQuery Migrate plugin.

I would suggest taking a look at the WordPress Changelog starting at V5.6.

Hi, it’s important to use the correct Html-Tags becouse all the Crawlers search for these.
To tell Google what’s going on at your page you need to provide several informations. One of this is a main heading (h1). So if a User searches for “Html” fo example and your h1 heading says “How to write Html” it’s more likely to show up at the search results for “Html”.

H1 should be present on every page.

Any other headings should be smaller (starting by h2).

More or less every Layout has one main Heading. So just change the Tags arround that heading to h1. If there is no heading you should create one.

Hey qtn8,
in your styles.css on line 96 there is this:

#mobile-logo.logo-center {
    margin: 0;
}

You could just add -auto- to it:

#mobile-logo.logo-center {
    margin: 0 auto;
}

Seems like it’s doing the job. Let me know if you expirience any issues.

The whole CSS should be:

@media screen and (max-width:600px) {
   #mobile-logo.logo-center {
       margin: 0 auto;
   }
}

It’s centered if your screen is less than 601px width

Hi learningtocode,
try this CSS:

#site-navigation {
	width:fit-content;
	margin: 0 auto;
}
.site-header-menu {
	width:100%;
}

You could hide Video controls so User won’t be able to click in the timeline to skip some parts.

<video nocontrols>
</video>

But keep in mind to set autoplay on your video becouse no user can click play button

<video nocontrols autoplay>
</video>

(Autoplay in Chrome only works muted)

Hi hadarhacohen,
just paste this into your CSS

.content-area {
    border: none;
}

Hi sirprizes,
you can trigger find function with JavaScript too.

1. Create Input Field
<input type="text" id="searchterm" placeholder="Enter value...">

2. Copy/Paste Js function into your scripts

function findTerm() {
	var searchField = document.getElementById("searchterm");
	if (searchField.value != null) {
		window.find(searchField.value);
	}
}

3. Call Function
You can call the function if someone changes the input field or by clicking a button. onclick or onchange

<input type="text" id="searchterm" placeholder="Enter value..." onchange="findTerm()">
<button onclick="findTerm()" class="button">Find</button>

Hi Amira,
if you want to achieve a sharing function including all Apps installed on a device, you can use Navigator.share() (yes, javascript):
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share

It says that Chrome only supports this partialy but i did not expirience any difficulties while using it.

hi geront,
it’s hard to give you answers without actually knowing what’s going on.

Could you provide the exact CSS code you added to your project? Not the whole CSS file only the float thing.

I can only check Sourcecode in the logged-out state. So if you could show me what the top bar HTML looks like if logged in that would be helpfull.

• This reply was modified 3 years ago by mango404.

Just use float.

For example if your login link is a element with the class “login-button”:

.login-button {
 float: right;
}

But keep in mind that the elements under that link are going to float into that area too. Just add a div with the following styles directly under the a element:

HTML:
<div class="clear"></div>

CSS:

.clear {
clear: both;
}

If you want the whole nav to float right, just add de css to it the same way

Hi shirinwp,
if you are currently using HTTPS while the iframe wants to show an HTTP page, it won’t work.

Also there are code snippets provided by Google Maps for example. You have to use these to make your iframe work. If you just use the Google Maps URL it won’t work. Just search for the -embed- button and copy paste the iframe snippet.

Websites can allow or block you from using them as a iframe.

Hope it helps

Hi michalrama,
none of these GIFs are transparent.

For example This from your Site.

Best Practise would be a .ico file to use as a Favicon. Export your Logo again and check if it’s truly transparent (i would preffer PNG instead of GIF becouse of quality). If so, convert it Here. You get a preview displayed and you can download all sizes and files at once.

Favicon best Practise:
w3schools Favicon

Additionally you can trigger downloading directly onclick.
<a href="/uploads/my-pdf.pdf" download>Download</a>

w3schools Download

• This reply was modified 3 years ago by mango404.

Hi,
with JavaScript you can add an history entry.

If someone comes to that page the script could just add a step between Google and the current page.

History API
Push State

• This reply was modified 3 years ago by mango404.

Hi ed,
what has the transition to do with wordpress keyword searching?

It’s quite a heavy goal for a newbie like you to achieve this effect. I Would suggest thinking about a much simpler solution. Like AOS:
https://michalsnik.github.io/aos/

While using that onscroll library you just have to add the following to every section you want to animate

data-aos="zoom-in"