How to add a new route

joncodo

I want to add another page for custom stuff.

I want it to be at localhost:4567/iframe

Where can I add this route so I can navigate to it by visiting that url.

I want it to contain just the menu and an iframe to another site I own.

Thanks in advance!

JasperNL

Do you want a redirect to that page or do you want to keep the navigation bar?

In the first case: on the ACP you can change the navigation bar.

In the second case: there is a plugin that provides custom routes. I don't know the name but i can look it up!

yariplus

nodebb-plugin-custom-pages will work. It creates blank page routes with widget areas. You would use the Widgets ACP to insert an HTML widget on your new page and add the iframe there.

joncodo

What is the ACP?

joncodo

Ah, ACP = 'Admin Control Panel'?

yariplus

@joncodo yes

joncodo

So that kind of works for me. I am now trying to make it look seemless. But the .container class has a margin and padding. I'm trying this hack to get it to work.

var left = $('.container:has(.iframe-content-bsft)').css("margin-left"); //"88px"
var leftNum = Number(left.split('px')[0]);
var top = $('.container:has(.iframe-content-bsft)').css("padding-top"); //"15px"
var topNum = Number(top.split('px')[0]);
var width = $('.container:has(.iframe-content-bsft)').width(); //1170
var widthNum = Number(width.split('px')[0]);

var totalWidth = widthNum + leftNum * 2;

$('#iframe-content-bsft').css("margin-left", "-" + left)
$('#iframe-content-bsft').css("margin-top", "-" + top)
$('#iframe-content-bsft').css("width", totalWidth + "px")

</script>

If I run it in the chrome dev tools, it works perfect. But when I put it in the admin tool in manage plugins, the script seems to not work.

Am I going about this the wrong way? Is there a better way to do this?

yariplus

Why are you not just setting a negative margin in the iframe style?

joncodo

It is working now! Thanks guys! It was the variable name top. I changed it to _top and it works perfectly