How to remove the "show code" button - Replit iframe embedding?

Replit Help
1

I have a Python repl embedded into my website as an iframe and would like to remove the “show code” button. Is there a way that I can do this?

I would like to enable users to run the output of the Python code only.

It is a public repl.

Repl link/Link to where the bug appears:

Screenshot 2023-10-22 at 16.52.31
Screenshot 2023-10-22 at 16.52.31840×500 45 KB

1 Like
2

Welcome to the forums, @annaw123!
I do not believe that this is possible, as it is a iframe.

1 Like
3

Thank you.

Is there another way of doing this? I’d really like to remove it.

This is an example of the code I’m using - do you know if I could change / add some parameters into the link?

This is an example of the page it’s on:
https://missionencodeable.com/python/level/1

1 Like
4

I don’t think that you can prevent anyone from not seeing the code. Repls are either all public or all private. you can also do cat in the repl shell.

5

Thank you.

I don’t really mind about people being able to access the code on my account, it’s just this big, obvious button on the embeds that’s the issue as this is where I think most people could very easily locate the solution code - do you think there’s a way to make it smaller somehow / remove it?

Perhaps not if it is public…

1 Like
6

If it is not public, then users will not be able to access the iframe. There is no way (that I know of) to alter the CSS of the button within an iframe.

1 Like
7

I agree that I can’t edit the CSS of the button within the iframe.

I saw on an older forum (perhaps 3 year old) that it was possible to add lite=1&outputonly=1 - do you know if there’s a current equivalent?

1 Like
8

I’m honestly not even sure what those are lol

9

I don’t know either…! Do you know @python660 ?

Do you know if there’s any way I could contact Replit support about it?

3 Likes
10

yes, lite means to show a simplified version, instead of the full blown cover page of the repl. outputonly defaults to showing the output of the program instead of the code alongside of the output.

11

Ok, thank you again!

Adding those parameters doesn’t seem to work though sadly. I’ve attached a picture of what I added.

Screenshot_2023-10-22_173628
Screenshot_2023-10-22_1736281440×579 55.2 KB

@ShaneAtReplit @DavidAtReplit can either of you help?

Alternatively, can anyone suggest another platform I could use in a similar way? Wouldn’t be ideal so would prefer to find a way using Replit!

12

Hi @annaw123! Please avoid pinging people who are not in this thread.

13

Can I see the code that you’re embedding the Repl page in? I believe there’s a way to do this (I’m not 100%, but I think you can).

1 Like
14

Exciting… please do let me know what way this is so I can try it!

I’m using React so here’s the component that the iframe is in. Please let me know if you need any more code.

import React from "react";

function Project(props) {
    return (
        <div className="project">
            <div className="project_text">
                <h3>{props.title}</h3>
                <p>{props.description}</p>
            </div>
            <div className="replit_embed">
                {/* An example of the replit_link would be "https://replit.com/@MissionEncode/Python-Level-9-Quiz-Game-Solution-Code?embed=true" */}
                <iframe frameBorder="0" width="90%" height="300px" src={props.replit_link}></iframe>
            </div>
        </div>
    )
}

export default Project;
1 Like