How to push data "key and value" from website to Google Tag Manager Data Later?

This is not a good solution - by writing your own javascript function to capture query strings you are basically negating the purpose of GTM. Use a "Url" type variable instead, set "component type" to "query string" and in the "query key" input field enter the name of your parameter.

But to answer your question (even if your approach for that particular problem is not good), yes, you need to create a variable to read data from the dataLayer.

First you push the value to the dataLayer. The dataLayer is an array of objects, so you "push" a new object with key/value pairs:

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  "myDLKey":"myValue",
  "event":"updateMyDLKey"
});

Then in the "variables" section of thr GTM interface, you create a dataLayer variable with the key whose value you want to retrieve.

There is basically no use case to change the dataLayer version. You can specify a default value, in case the key does not exist in the dataLayer, else the variable will be undefined.

Note that you need to push an event along with any new or updated key/value pairs, because the "event" key tells GTM to update its internal state; else the pushed values will be inaccessible.

There are some events that occur "naturally" - e.g. you do not need ab event in the dataLayer to capture values with the Url type variable, because in most cases there will be a pageload event (other "built in" events are DOM ready, window loaded, and click and submit if you have any of the built-in click or form variables enabled).