How Can I Change Text on a Page by Modifing a URL?

  • JohnWithQuestions
  • Born
  • Born
  • JohnWithQuestions
  • Posts: 2

Post 3+ Months Ago

Hello,

I have recently found webpages where Text that displays on a webpage is Dynamically changed based on the URL - for example: a URL that ends and is followed by - ?a=OZZU!

Then when the webpage loads you see the "OZZU!" text on the page...

I have Viewed the Source Code of the pages I have seen, but there is no code there, only the text, for example: "OZZU!" as if it were coded that way.

How is this done?

Thanks!
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • mk27
  • Proficient
  • Proficient
  • User avatar
  • Posts: 334

Post 3+ Months Ago

The ?a=OZZU is a query string. These are submitted using a <form>. The form may not be visible on the page. For example:
Code: [ Select ]
<form action="process.cgi" id="theform">
  <input type="hidden" value="OZZU" name="a">
</form>
  1. <form action="process.cgi" id="theform">
  2.   <input type="hidden" value="OZZU" name="a">
  3. </form>

This form has no submit button and no visible elements at all. Then there could be a link somewhere in the page with some javascript onclick function:
Code: [ Select ]
<p onclick="document.getElementById('theform').submit">

This will submit the unseen form. The action specified is "process.cgi". A CGI program is one which processes the query string sent to it (a=OZZU) and creates a page (as you point out, dynamically) incorporating that information.

CGI can be done using a bunch of server-side methods. For example, you can respond to a form using PHP. If the address of the page has an .html suffix (/whatever.html?a=OZZU) that is probably how it is done -- either with PHP or some other embeddable language such as Ruby or Perl. For example, here is part of a perl/mason "page" which responds to a form:
Code: [ Select ]
<& header.comp &>
<body>
<h1><% $ARGS{a} %></h2>
[...]
  1. <& header.comp &>
  2. <body>
  3. <h1><% $ARGS{a} %></h2>
  4. [...]

The server processes this and replaces $ARGS{a} with "OZZU". It also replaces <& header.comp &> with that file, which is presumable the <head> section of a proper html document.
  • joebert
  • Sledgehammer
  • Genius
  • User avatar
  • Posts: 13496
  • Loc: Florida

Post 3+ Months Ago

Start with this, programming-forum/brief-comparison-server-side-scripting-langauges-t90248.html

You'll need to use a Server-side Scripting Language to retrieve the GET variable ( ?variable=value ) from the URL, and to generate a dynamic page using that variable.

--

Alternatively, you can use Javascript to retrieve the GET variable and add it to the page using the DOM. This method has the visitors browser doing the work instead of the server, and is easier to learn than the server-side method.

--

In a nutshell, server-side is like building a house at the factory and delivering a completely built house to the property. browser-side is like building a house in modules, delivering those modules to the property, and having the property owner assemble the modules.
  • mk27
  • Proficient
  • Proficient
  • User avatar
  • Posts: 334

Post 3+ Months Ago

joebert wrote:
You'll need to use a Server-side Scripting Language to retrieve the GET variable ( ?variable=value ) from the URL, and to generate a dynamic page using that variable.


Actually CGI can be done in absolutely any language, as a CGI process is a "black box" that simply works with STDIN and STDOUT (the "server-side scripting languages" use interpreters which tap the server in a similar way). But pure CGI is kind of "old school" and this is maybe a trivial point -- unless the OP has any kind of previous programming experience, in which case CGI is a very straight forward introduction to dynamic web page generation. You can also do anything with it, just the relationship to the page is the inverse of using embedded stuff (you embed html in the code, rather than vice versa). PHP, etc. developed out of CGI methods that used template files and the substitution of symbols.
Code: [ Select ]
<body>
<h1><!TITLE!></h1>
  1. <body>
  2. <h1><!TITLE!></h1>

Save that as a text file and source it in your CGI program (which could be in C or Fortran or BASIC), substitute <!TITLE!> for whatever, and print it to STDOUT. The raw query string is supplied to the program on STDIN. You don't need any libraries or anything, altho most languages do have some kind of CGI lib that simplifies, eg, parsing the query string.
  • Hacker007
  • Proficient
  • Proficient
  • User avatar
  • Posts: 371
  • Loc: Riverside, CA

Post 3+ Months Ago

Use JavaScript to get the URL query into an array. Here is a tutorial:
http://www.eggheadcafe.com/articles/20020107.asp

then use innerHTML to alter the text based on the array value.
  • JohnWithQuestions
  • Born
  • Born
  • JohnWithQuestions
  • Posts: 2

Post 3+ Months Ago

Thanks for the reply(s) everyone, but I guess I'm not smart enough to really get this... I'm reading it, but not really getting it. It seems to be using "forms"? and What I have been seeing is not using a form to get the info on the page -

Here is what I see from one of the sites that is using this feature, maybe it will give you a better idea of why I might not be getting this.

(1) the URL looks something like this:
...com/something.php?t=ghb999&k=OZZU&gclid21=CNeFmo...

(2) When I view the Webpage I see OZZU on the Page, and when I view the Page Source, I see the section with "OZZU" that says:

...

<div id="superwrapper">
<div id="top-title"></div>
<div id="supertopnavwrap">
<div id="supertopnav"><font color=#FFFFFF><h1>Page Header Title</h1></font></div>
</div>
<div id="top-header">
<font color=#FFFF44><h2>Sub-Header Title<br>The Best Site Is
OZZU</h2></font>
</div>
<div id="super-contentwrap">
<div id="super-content">
<div id="lipsum">
...

So it is taking "OZZU" that is in the URL and Inserting it into that section of text on the page...

If I change the "OZZU" in the URL to "SOMETHING ELSE" it actually prints "SOMETHING ELSE" on the page... so it is totally controlled by what is written in the URL.

Hope this helps you to help me.

Thanks!
  • mk27
  • Proficient
  • Proficient
  • User avatar
  • Posts: 334

Post 3+ Months Ago

JohnWithQuestions wrote:
If I change the "OZZU" in the URL to "SOMETHING ELSE" it actually prints "SOMETHING ELSE" on the page... so it is totally controlled by what is written in the URL.

Yes.

The form will not be in the page that RECEIVES the query string*, which is the page you see. Technically, that code is not actually what receives the query string either -- what recieves it is a server side script or program that CREATES the page. You do not have access to the code, so you cannot see it.

And in fact, no form is needed, just generally that is the case (the query string is created by the browser based on the form data). But you can "spoof" a query string as you describe. This is directed to an address, eg, myurl.html?a=OZZU. If it is myurl.cgi?a=OZZU, it is actually a program that outputs a web page. If it is "html", then it is the same thing, but in that case the program is a server module that parses the page for embedded server-side scripting info and creates the page you see based on that. In other words, the "page source" you see does not at all look like myurl.html on the server. The transposition occurs on the server, not your computer. Your computer receives the output.

Just google around and read some "intro to CGI" and "intro to server-side scripting" (or "intro to PHP", since that is the most popular language, I think). If you have not done any programming before, you will not be doing this tomorrow. Maybe like, next week.

*the form would be in the page that connected you to the current page. You fill out a form, you get a page containing the response. Forms can also be hidden (but they will be in the page source from your browser).

Post Information

  • Total Posts in this topic: 7 posts
  • Users browsing this forum: No registered users and 38 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.