Need bit of WordPress Guidence please.

TheSwede · 4 Oct 2015 at 15:25

Hi all,

Need a bit of help, working on a website for fun, collecting information about a game I'm playing. Has loads of links leading to information about items within the game and what I ideally would like is to make the links show up in a custom sized window, but without having to go into the TEXT part of making the post/page in WordPress. Since it would be very time consuming, done some that way already but hoping maybe you guys can direct me to an easier solution.

In the spoiler below is a picture of the Image Details, if I put the word "popup" down at Link CSS Class, I do get a window popup but in a to big size.

To correct the oversized popup window I have to manually go into the TEXT editor part of making a post/page and add the following:

Code:

data-height="480" data-width="680" data-scrollbars="0"

But if what I found is right, I should be able to do a CSS Class to custom size the widnow popup size, I think ?? Probelm is, have no idea where to even start to look for the information since know nothing about CSS, hence asking here for some pointers, either link to where I should be able to figure out how to do it or more direct guidelines as to how to proceed. I even tried to find a plugin that might have helped but they all seems to be directed towards commercial sales and similar.

If it makes a difference, there is about 3 different size of the windows I done so far, does that mean I need a separate CSS sheet done for each one, or would one be enough pointing to a certain 'line' within the CSS sheet ?? *shruggs* As mentioned further up, totally newbie to CSS so no clue, just thought I mention it now, incase it would matter.

Thank you for reading and any and all information you can help me with would be greatly appreciated !

uniQ · 5 Oct 2015 at 10:28

A good start would be to use the inspection editor of your browser to view the source and find the related css. Then add an override in your theme.

roger that · 5 Oct 2015 at 22:15

The popups are generated by the showArtifactInfo function in the common.js file.

The data- HTML attributes are parsed by the javascript engine, so they over-ride the window values in the showArtifactInfo function.

over_gamed · 6 Oct 2015 at 09:12

Hey, PM me the link to the page with the popup window

roger that · 6 Oct 2015 at 10:25

over_gamed said:
Hey, PM me the link to the page with the popup window

The link is in the image above.

TheSwede · 6 Oct 2015 at 12:07

roger that said:
The link is in the image above.

Nope that not the link to my site.

At work niw so not much time but will post proper link when I'm home tonight to one page where I done a couple different examples.

Thanks for the replies so far, much appreciated !!

TheSwede · 7 Oct 2015 at 07:52

Thank you for your replies, much appreciated ! Sorry I didn't respond directly after you posted them but been working and trying to figure out what you meant.

uniQ said:
A good start would be to use the inspection editor of your browser to view the source and find the related css. Then add an override in your theme.

Did check the source code but to be honest, no clue really what CSS to look for, or anything else there for that matter. As I did mention in first post, totally newbie on this stuff.

roger that said:
The popups are generated by the showArtifactInfo function in the common.js file.

The data- HTML attributes are parsed by the javascript engine, so they over-ride the window values in the showArtifactInfo function.

Tried to find the above, according to wordpress itself it should be at /wp-admin/js/common.js .. but having looked through the control panel, all I could find was the edit of the theme, and nothign said common.js there. Or I missed it. :confused:

over_gamed said:
Hey, PM me the link to the page with the popup window

Sorry, should probally have posted that from the start. Here is a link to a page where I done a couple popups manually in the TEXT part of the page editing side.

Code:

http://wodknowport.com/instances/derelict-house/chess-sets/

Now, what I done is the first image is done as the picture showing in the first post, and the popup window is way to large. The second image right next to it is how I would like some of them to look, which been done in the TEXT part.

The first image in the 2nd row shows another size that I be using as well throughout the site, just thought I drop in that one as well. The rest is done as opening in another tab, and rather few of the others have not been done yet.

I did find a plugin that alter the Image Detals box, but it only adjust an images margin's and border, so not what I'm looking for but at least the Image Details box can be edited by a plugin. Just need to figure out how. lol

Thank you once again for trying and help me out, it is VERY much appreciated ! I buy you all a round of virtual beer for your help !

TheSwede · 14 Oct 2015 at 09:14

No one has any suggestion for such a plugin or how to modify the plugin that I found ?? which is called Advanced Image Styles and I see I forgot to link to that one above.

I found a plugin called WP Editor which makes it slightly easier to edit the TEXT section when adding the Height and Width Attributes but still very time consuming.

If anyone knows how to edit the above plugin (Advance Image Style) to have the Height and Width Attributes for a popup window inserted in the HTML code that would be awesome !